D3 Examples - Actores e Iniciativas en Territorio

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=Poppins" 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: 0.5;
            stroke-width: 2;
            opacity: 0;
            }
​
            .nodos:hover{
                cursor: pointer;
            }
​
            .nodos.urbano {
                fill: #99d9f4;
            }
​
            .nodos.ambiental {
                fill: #009fe3;
            }
​
            .nodos.inclusion{
                fill: #0000ff;
            }
​
            .nodos.academia{
                fill: #c6e18d;
            }
​
            .nodos.financiacion{
                fill: #ffda47;
            }
​
            .nodos.gobierno{
                fill: #ffa182;
            }
​
            .nodos.ong{
                fill: #ff7ab8;
            }
​
            .nodos.privado{
                fill: #ff0046;
            }
​
            .nodos.gremios{
                fill: #ba0000;
            }
​
            .leaflet-pane {
            z-index: 98;
            }
​
            .text{
                font-family: 'Poppins', sans-serif;
                fill: black;
            }
​
            .tooltip {
            position: absolute;
            background-color: #fafafa;
            font-family: 'Poppins', sans-serif;
            font-size: 11px;
                width: 350px;
            height: 250px;
            padding-left: 10px;
                padding-right: 10px;
            z-index: 99;
            }
​
            br {
            display: block;
            margin: 5px 0;
            }
​
            .convenciones{
                position: absolute;
                z-index: 99;
            }
        </style>
    </head>
    <body>
        <div id="map" style="width: 1900px; height: 1080px"></div>
        <script src="panama_nodos_mapa18.js"></script>
    </body>
</html>
​
    