Articles of d3.js

Combinando dos csv’s (d3)

Estoy cargando dos archivos csv usando el siguiente código d3.csv(“sqrt100train.csv”, function(error, data2) { d3.csv(“sqrt100test.csv”, function(error, data) { sqrt100train tiene este aspecto: Trees Train 1 0.059286 2 0.057857 3 0.032857 4 0.03619 5 0.022619 y sqrt100test se ve así: Trees Test 1 0.072222 2 0.072778 3 0.044444 4 0.049444 5 0.042778 ¿Cómo combino estas matrices para […]

D3: combina círculos e imágenes

Tengo función para generar circulo e imagenes. node.append(“circle”) .attr(“r”, function(d) { return d.weight * 2+ 12; }) .attr(“class”, “logo”) .style(“fill”, “transparent”) .style(“stroke”, “black”) .style(“stroke-width”, 0.25) .on(“mouseover”, function(){ d3.select(this) .style(“fill”, “url(#/images/fake/FakeTree/100331934)”); }) .on(“mouseout”, function(){ d3.select(this) .style(“fill”, “transparent”); }); node.append(“image”) .attr(“xlink:href”, d=> d.url) .classed(“MakeItround”, true) .attr(“x”, function(d) { return d.weight * 2-35; }) .attr(“y”, height/15 -38) .attr(“width”, […]

Trazar mapas json personalizados con D3.js

Estoy creando un mapa con D3.js. Comencé descargando el shapefile del país (Canadá) aquí: https://www.arcgis.com/home/item.html?id=dcbcdf86939548af81efbd2d732336db ..y lo convirtió en un geojson aquí (enlace al archivo a continuación): http://mapshaper.org/ Hasta ahora todo lo que veo es un bloque de color, sin errores en la consola. Mi pregunta es, ¿cómo puedo saber si mi archivo json o […]

D3 mousedown evento eliminando el nodo incorrecto

Estoy tratando de agregar una característica de eliminar nodo en este jsfiddle El método de refresh está agregando on(“mousedown”, mousedownNode) a cada círculo, pero cuando hago clic en el nodo GW2 se elimina el nodo DB . Descubrí que el método mousedownNode elimina el nodo correcto pero, node = node.data(nodes); en el método de actualización […]

Cómo anular los eventos de arrastre en C3.js

Actualmente estoy intentando implementar una función de zoom que es ligeramente diferente de la que ya existe. En realidad, me gustaría que si un usuario hace clic y arrastra en el gráfico, se acerque al dominio definido. Me gustaría hacerlo de esa manera porque con la rueda del mouse evita que el usuario suba / […]

Añadir atributo con entradas anidadas en D3.js

He usado d3.nest () para valores de grupo por fila El código es así function createNestingFunction(propertyName){ return function(d){ return d[propertyName]; }; } var levels = [‘first’, ‘second’, ‘third’] var nest = d3.nest(); for (var i = 0; i < levels.length; i++) { nest = nest.key( createNestingFunction(levels[i]) ); } var root = { "key":"root", "values": nest.entries(data) […]

Cómo agregar un separador en el gráfico de barras D3

Tengo un gráfico de barras en mi aplicación que se dibujó utilizando D3. El código de muestra se ha añadido a continuación. En mi gráfico, muestra los meses en un período de 12 meses. Entonces, dependiendo de la situación, diciembre no siempre llega a la esquina del eje x. Entonces, para mostrar la separación del […]

¿Cómo reemplazar la línea en la tabla por la serie de puntos?

Estoy intentando usar el enfoque de ‘Gráficos Reutilizables’ descrito por @mbostock, todo está bien cuando se usa una línea ( ). Sin embargo, cuando bash usar puntos ( ), solo se agrega un elemento a la tabla y no está bien formado ( cx y cy incorrectos). Mi bash de código es entre las líneas […]

Mapa + Leyenda en el mismo svg

Llevo una semana intentando realizar este Map + Legend Todavía no puedo mostrar correctamente mi leyenda cuando sigo esto var legend = svg.selectAll(“g.legend”) .data(extent_color_domain) .enter().append(“g”) .attr(“class”, “legend”); var ls_w = 20, ls_h = 20; legend.append(“rect”) .attr(“x”, 20) .attr(“y”, function(d, i){ return h – (i*ls_h) – 2*ls_h;}) .attr(“width”, ls_w) .attr(“height”, ls_h) .style(“fill”, function(d, i) { return […]

D3 astackdo cuadro de problemas de conversión de tsv a csv

Estoy tratando de convertir este ejemplo de tsv a csv. Actualmente esto es lo que tengo: https://jsfiddle.net/asb1926/sc5wdkLe/ El error que sigo recibiendo es este (en el jsfiddle es la línea 46): d3.v4.min.js:7 Uncaught TypeError: Cannot read property ‘length’ of undefined at t (d3.v4.min.js:7) at SVGPathElement. (line:61) at SVGPathElement. (d3.v4.min.js:2) at _t._l [as each] (d3.v4.min.js:4) at […]