D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
bejucoo
Full window
Github gist
actores_1
Built with
blockbuilder.org
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Mapa Panamá</title> <script src="https://d3js.org/d3.v4.js"></script> <link href="https://fonts.googleapis.com/css?family=Varela+Round" rel="stylesheet"> <style type="text/css"> .link.politica { fill: none; stroke: #9d664f; stroke-opacity: .05; } .link.social { fill: none; stroke: #f9c2a7; stroke-opacity: .05; } .link.economica { fill: none; stroke: #753815; stroke-opacity: .05; } .link.politica-social{ fill: none; stroke: #f1401c; stroke-opacity: .05; } .link.politica-economica{ fill: none; stroke: #530d0b; stroke-opacity: .05; } .link.social-economica{ fill: none; stroke: #fbd127; stroke-opacity: .05; } .link.politica-social-economica{ fill: none; stroke: #d68399; stroke-opacity: .05; } .nodos.gobierno { fill: #4f8c9d; } .nodos.patrimonio { fill: #a7dcf9; } .nodos.planeacion{ fill: #154975; } .nodos.ong{ fill: #1cf1a3; } .nodos.gremios{ fill: #0b5313; } .nodos.academia{ fill: #99d683; } .nodos.comunidad{ fill: #359721; } .nodos.privado{ fill: #1ceaf9; } .nodos.medios{ fill: #5f4ac2; } .nodos.otros{ fill: #ccabf0; } text{ font-size: 9px; font-family: "Varela Round", sans-serif; opacity: 0.5; } .d3-tip { line-height: 1; font-weight: bold; font-family: 'Varela Round', sans-serif; text-align: center; font-size: 10px; padding: 20px; background: rgba(0, 0, 0, 0.8); color: #fff; border-radius: 1px; } .tooltip { position: absolute; border: 1px #cacaca; background-color: #fafafa; padding: 2px; border-radius: 2px; font-family: 'Varela Round', sans-serif; width: 300px; height: 300px; padding-left: 10px; } br { display: block; margin: 3px 0; } </style> </head> <body> <script src="panama_nodos_circulo_6.js"></script> </body> </html>
https://d3js.org/d3.v4.js