Tengo problemas para mostrar varios gráficos D3 en una página. He intentado muchas cosas, pero parece que solo puedo obtener una de las visualizaciones en la página, no ambas.
Para la primera visualización en HTML, tengo:
<section id="first" class="main special"> <header class="major"> <h2>Presidential Elections</h2> </header> <body> <div id="lineChart"></div> <script src="lineChart.js"></script> </body> </section>
Mi segunda visualización es similar en index.html:
<section id="second" class="main special"> <header class="major"> <h2>House Seats Lost Based on Current President</h2> </header> <body> <div id="barChart"></div> <script src="barChart.js"></script> </body> </section>
En lineChart.js y barChart.js, no tengo ninguna visualización etiquetada como 'svg', sino 'lineChart' y 'barChart' respectivamente. El código actual muestra solo la primera visualización (gráfico de líneas), pero descubrí que cuando <script src="lineChart.js"></script>
, la primera visualización (gráfico de líneas) desaparece y la segunda (gráfico de barras) la visualización se vuelve visible. ¿Alguien tiene alguna idea u orientación sobre lo que estoy haciendo mal?
Es difícil de decir sin ver el código. Pero puede seleccionar todos los svg
s o div
s y llamar a remove()
. Busque el código que hace eso e intente eliminar la llamada remove()
.