0
381
VistasD3.JS: svg se muestra en el editor de github, pero no en Visual Studio Code, ¿por qué?
Como principiante de D3, actualmente estoy haciendo un tutorial usando el editor de Github. Hasta ahora todo funciona. Sin embargo, cuando uso el código uno a uno en mi IDE, ¿no se muestran los círculos negros ? ¿¿Cómo puede ser esto??
índice.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="css/styles.css"> <title>Document</title> <style> body { margin: 0; overflow: hidden; } </style> <script src="https://d3js.org/d3.v7.min.js"></script> </head> <body> <p>This is just a test</p> <svg id="container" width="960" height="500" ></svg> </body> </html>**índice.js++
import {select, forceSimulation, forceManyBody, forceLink, forceCenter} from "d3"; const nodes = [ {"id": "Alice"}, {"id": "Bob"}, {"id": "Carol"} ]; const svg = select("#container"); const width = +svg.attr("width"); const height = +svg.attr("height"); const centerX = width / 2; const centerY = height / 2; const links = [ {"source": 0, "target": 1}, // Alice → Bob {"source": 1, "target": 2} // Bob → Carol ]; const simulation = forceSimulation(nodes) .force("charge", forceManyBody()) .force("link", forceLink(links)) .force("center", forceCenter(centerX, centerY)); const circles = svg.selectAll("circle").data(nodes).enter().append("circle").attr("r", 30); simulation.on("tick", () => { circles.attr("cx", d=>dx) circles.attr("cy", d=>dy) });
·
Juan Pablo Isaza
Responde la pregunta