D3 Examples - nodos

xxxxxxxxxx
 
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
<meta http-equiv="Content-type" content="text/html; charset=UTF-8">
        <title>Mapa de Actores y Proyectos en Territorio</title>
        <script src="https://d3js.org/d3.v4.js"></script>
​
        <link href="https://fonts.googleapis.com/css?family=Varela+Round" rel="stylesheet">
​
        <link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.3/dist/leaflet.css" />
        <script src="https://unpkg.com/leaflet@1.3.3/dist/leaflet.js"></script>
​
        <style type="text/css">
            .link {
                stroke: black;
                stroke-opacity: .5;
                stroke-width: 2;
                opacity: 0;
            }
​
            .nodos:hover{
                cursor: pointer;
            }
            
            .nodos.urbano {
                fill: #1C49C4;
                            
            }
​
            .nodos.ambiental {
                fill: #57C759;
                
            }
​
            .nodos.inclusion{
                fill: #E5D064;
                
            }
​
            .nodos.actor{
                fill: #75C3F0;
                
            }
​
            .nodos.colaborador{
                fill: #AAF075;
                
            }
​
            .nodos.financiador{
                fill: #E7E6A6;
                
            }
​
            .leaflet-pane {
                z-index: 98;
            }
​
            .tooltip {
                position: absolute;
                background-color: #fafafa;
                font-family: 'Varela Round', sans-serif;
                font-size: 10px;
                width: 300px;
                height: 200px;
                padding-left: 10px;
                z-index: 99;
            }
​
            br {
                display: block;
                margin: 5px 0;
            }
​
            .convenciones{
                position: absolute;
                z-index: 99;
            }
        </style>
    </head>
    <body>
        <div id="map" style="width: 1300px; height: 650px"></div>
        <script src="panama_nodos_mapa13.js"></script>
        <script src="jquery.js"></script>
    </body>
</html>
    