C3: Formas personalizadas para puntos

Creado en 20 mar. 2015  ·  47Comentarios  ·  Fuente: c3js/c3

Sería genial poder definir diferentes formas (círculo, cuadrado, triángulo, estrella, ...) para los puntos del gráfico.

Son 2 razones principales para eso:

  • Impresión en una impresora de escala de grises
  • daltónicos

Se crearon algunos temas en el grupo de Google sin respuesta:
https://groups.google.com/d/topic/c3js/I2UhY4U6zI0/discusión
https://groups.google.com/d/topic/c3js/gZrpl0QpKYw/discusión
https://groups.google.com/d/topic/c3js/6QRQ1VWx3vw/discusión

La leyenda debe usar la misma forma que la definida para los puntos.

Así es como me imagino la configuración:

point: {
  shape: {
    'data1': 'circle',
    'data2': 'square',
    'data3': 'triangle'
  }
}

o, para definir algunos otros atributos personalizados:

point: {
  'data1': {
    shape: 'circle',
    color: '#ff0000',
    r: 2
  },
  'data2': {
    shape: 'square',
    color: '#0000ff',
    r: 3
  }
}
C-feature-request R-needs-docs

Comentario más útil

Todos los que quieran esta función, suscríbanse o usen una respuesta emoji en lugar de responder +1.

Gracias.

Todos 47 comentarios

Realmente apreciaría esta función.

+1

mayor +1

+1

+1
¿Alguien encontró una manera de lograr esto?

Trabajé en la implementación de formas personalizadas para los puntos de la trama. He implementado formas cuadradas y rectangulares.
Aquí está mi trabajo:
https://github.com/prakulgupta/c3.js-CustomPlotPointShapes-Feature.git

Espero que esto pueda ayudar a las personas que necesitan la función de forma personalizada :+1:

¡Gracias @prakulgupta !
Para lograr diferentes formas, tuve que ejecutar una función d3 después de construir el gráfico que cambió los círculos a cuadrados. Me hace sentir asqueroso. Mi plan era simplemente reconstruir nuestro diagrama de dispersión con d3 directo. ¡Probaré ese repositorio!

A +1 también le encantaría ver esto integrado.

+1 muy necesario

¡+1 sería genial!

@prakulgupta ¡Parece un muy buen candidato para una solicitud de extracción! ¿Tal vez considerarías hacerlo? ¡Gracias!

quiero una forma de triángulo :( , o una marca de flecha. Para mostrar el punto en el gráfico de barras.

+1

+1

👍

Encontré la solución para esto. Usa d3. Es mucho más fácil de lo que imaginas. Ejemplo: http://bl.ocks.org/bunkat/2595950

Yo diría que esto no es realmente una solución.
Estamos usando el montón de funciones que proporciona c3. Reescribirlos usando la biblioteca nativa d3 no es muy útil.

+1, también sería genial tener tipos de puntos para la leyenda

+1!

+1

👍

+1

Todos los que quieran esta función, suscríbanse o usen una respuesta emoji en lugar de responder +1.

Gracias.

Algo así como un modo de cambio entre estos dos tipos de visualización de gráficos estaría bien.

¿Podría usar algo como https://github.com/d3/d3-shape#symbols para lograr esto?

Para otra solución con gráfico de dispersión, consulte aquí: http://stackoverflow.com/a/41848255/1178015

+1

👍

👍

+1

+1

¿Cuál es el estado de este problema/solicitud? Esto es realmente lo único que me impide usar C3js y me encantaría. A11y es una gran preocupación y los puntos sobre la impresión y el daltonismo son válidos. Agregué un pulgar hacia arriba el año pasado, pero el hilo se ha vuelto silencioso en términos de una solución. ¿Es esto algo que podría estar en desarrollo actual o se está denegando esta solicitud?

Gracias por todo el increíble trabajo y espero que sea posible una resolución.

También sería útil si permitiera más que símbolos, por ejemplo, imágenes o svg.
Por ejemplo, resaltar ciertos conjuntos de datos en función de algunos atributos sería muy bueno.

Sería aún más asombroso si pudiera permitir establecer una forma específica en un punto específico de un conjunto de datos.
Ejemplo de aplicación: En un gráfico de velocidad del viento (fecha en x, velocidad en y), permitiría mostrar la dirección del viento en cada valor (flecha direccional como forma de punto).

+1

👍

👍

Vote a favor del comentario que le gusta, en lugar de comentar +1 o me gusta, hace que sea más fácil seguir el problema al no enviar spam a la bandeja de entrada de nadie y solo enviar mensajes sobre entradas relevantes.

👍

👍

👍

👍

¿Puede alguien con un conocimiento más profundo del código base c3 comentar sobre cómo se podría implementar este cambio? Dada esa orientación, tal vez alguien de la comunidad se ofrezca como voluntario para asumir esta tarea.

¿Se espera algún progreso en esto? Este es un problema de casi 4 años a partir de este escrito.

@BrandKNY Este proyecto ya no se mantiene. billboard.js es la nueva rama activa, pero esta función tampoco está lista en billboard.js

( ¡Este problema es antiguo/2015! pero no existe ningún estilo de punto en https://c3js.org/reference.html)

Quizás el primer paso sea incluir una pequeña mejora en lugar de un gran salto a "cualquier forma"... Sugerencia: como en data.colors , definición por conjunto de datos , opción de oferta para definir el radio del círculo como objeto,

 point: { 
    r: { data1: 5,   data2: 2.5 } 
} 
¿Fue útil esta página
0 / 5 - 0 calificaciones

Temas relacionados

zachallia picture zachallia  ·  3Comentarios

snkashis picture snkashis  ·  4Comentarios

mwho picture mwho  ·  3Comentarios

Shugardude picture Shugardude  ·  4Comentarios

jstone-ponderosa picture jstone-ponderosa  ·  3Comentarios