Articles of d3.js

Cómo actualizar el eje con d3.js

Estoy tratando de mostrar diferentes datos en un gráfico. El usuario puede cambiar los datos mostrados haciendo clic en un botón de radio. Estoy usando un “Gráfico de burbujas” para representar los datos. Para cada tipo de datos necesito actualizar el Yaxis (el dominio es diferente). Esto es lo que hice por ahora: Inicialización de […]

D3: actualizar datos con múltiples elementos en un grupo

Tengo un gráfico combinado de barras / líneas. Para cada fila en el archivo de entrada, creo un grupo que contiene múltiples elementos (líneas, rectangularjs, textos): var myGroups = svg.selectAll(‘g’).data(myData) myGroups.enter().append(‘g’) … myGroups.append(‘line’) … myGroups.append(‘polygon’) … myGroups.append(‘text’) … Actualmente solo svg.selectAll(‘*’).remove() y crear todo desde cero cada vez que se actualicen los datos. Sin embargo, […]

¿Cómo usar x y ancho en un gráfico de barras con scaleTime?

Tengo un codepen aquí – https://codepen.io/anon/pen/xpaYYw?editors=0010 Es un gráfico de prueba simple, pero la fecha se formateará así. Tengo fechas en el eje xy cantidades en el y ¿Cómo puedo usar la escala x para establecer el ancho y la posición x de las barras? layers.selectAll(‘rect’) .data(data) .enter() .append(‘rect’) .attr(‘height’, function(d, i) { return height […]

Gráfico de barras del tubo químico d3.js

Estoy interesado en crear este gráfico de barras líquido de algún tipo. Con los punteros / marcadores punteados tirados hacia un lado como se muestra. 22 de abril: último código para trabajar con datos dynamics http://jsfiddle.net/NYEaX/1855/ último código de gráfico de barras http://jsfiddle.net/NYEaX/1827/ último código de ola de agua limpiado http://jsfiddle.net/Qh9X5/10331/ // Quiero quitar este […]

rotar el texto del eje x en d3

Soy nuevo en d3 y svg encoding y estoy buscando una manera de rotar texto en el eje x de un gráfico. Mi problema es que, por lo general, los títulos de xAxis son más largos que las barras en el gráfico de barras. Así que estoy buscando rotar el texto para que se ejecute […]

D3.js Map: ¿Cómo rotarlo?

Estoy construyendo un mapa de Filipinas con d3.js y, por alguna extraña razón, el mapa parece rotar a la izquierda, por lo que el país no se ve como realmente es. Intenté modificar el campo projection.rotate pero no parece que sea la línea de corrección. var width = 1060, height = 860; var svg = […]

d3.js v4: ¿Cómo acceder al índice de referencia del grupo padre?

La descripción de la función selection.data incluye un ejemplo con múltiples grupos ( enlace ) donde una matriz bidimensional se convierte en una tabla HTML. En d3.js v3, para dimensiones inferiores, las funciones de acceso incluían un tercer argumento que era el índice del dato del grupo padre: td.text(function(d,i,j) { return “Row: ” + j; […]

Agregue texto / etiqueta a los enlaces en el gráfico dirigido por la fuerza D3

He estado trabajando en un gráfico de fuerza dirigida modificado y tengo algunos problemas para agregar texto / etiqueta en enlaces donde los enlaces no están alineados correctamente con los nodos. ¿Como arreglarlo? ¿Y cómo puedo agregar un detector de eventos a un elemento de texto SVG? Agregar .on(“dblclick”,function(d) {….} simplemente no funciona. Aquí está […]

Calmar el tic de inicial de un diseño de fuerza

Acabo de comenzar a incursionar con d3 y encontrar la curva de aprendizaje bastante empinada. El proceso es completamente diferente de lo que estoy acostumbrado, y las matemáticas están muy por encima de mi cabeza. De todos modos, mi proyecto consiste en un diseño de fuerza que representa un mapa de integraciones entre sistemas. Esta […]

Cargando datos D3.js desde una cadena JSON simple

La mayoría de los ejemplos en la galería cargan datos de archivos TSV. ¿Cómo puedo convertir lo siguiente para usar una variable json local en lugar de datos de TSV? d3.tsv(“data.tsv”, function(error, data) { var myEntitiesJson = getEntitiesJson(); // <—— use this instead of "data" data.forEach(function(d) { d.frequency = +d.frequency; }); x.domain(data.map(function(d) { return d.letter; […]