Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

199
Vistas
¿Cómo exporto el estilo actual de un gráfico de la serie HighChart a PNG, JPG o PDF?

Estoy desarrollando un gráfico de serie de eficiencias (en porcentaje) a lo largo del tiempo.

Tengo requisitos específicos para la leyenda:

  • Al hacer clic en un elemento de la leyenda, se deja la serie en el gráfico, pero se desvanece la línea, los marcadores y el elemento de la leyenda para que aparezcan como "inactivos".
  • Al hacer clic en un elemento de leyenda 'inactivo', se deshace el desvanecimiento, por lo que la línea, los marcadores y el elemento de leyenda aparecen como 'activos'
  • Agregue casillas de verificación para cada elemento de leyenda: anular la selección y seleccionar una casilla de verificación tiene el mismo efecto que hacer clic en el elemento de leyenda asociado
  • Agrupe las series por un encabezado de categoría (en el violín que son las 'Células de Si cristalinas'): al hacer clic en este encabezado o en su casilla de verificación asociada, todo el grupo de la serie se 'activa' o 'inactivo'

Todo esto funciona en un violín, https://jsfiddle.net/slaws/0wjpcaqt/138/ , que usa styledMode y una leyenda personalizada y establece dinámicamente la opacidad del gráfico y los elementos de la leyenda personalizada:

 $('.highcharts-legend-item.highcharts-series-' + value).css('opacity', new_opacity); $('.highcharts-series.highcharts-series-' + value).css('opacity', new_opacity); $('.highcharts-markers.highcharts-series-' + value).css('opacity', new_opacity);

Sin embargo, estoy luchando con un requisito clave más, que es exportar el estado actual del gráfico a una imagen o PDF, con todas las series exportadas con su estado actual 'activo' o 'inactivo'. Por lo tanto, si una serie está difuminada, debe exportarse como difuminada a la imagen o PDF.

Aquí hay capturas de pantalla para ilustrar:

  • Esta es la visualización del gráfico en el navegador con la serie Multicrystalline inactiva
  • Así es como se exporta ese gráfico a PNG : quiero que la serie Multichrystalline se exporte para que se vea como lo hizo en el navegador, con su línea, marcadores y elemento de leyenda atenuados para que parezca 'inactivo'

¿Alguna sugerencia sobre cómo exportar el gráfico con su estilo actualmente vigente?

PD La leyenda en el violín puede comenzar desalineada, pero volver a ejecutarla corrige eso.

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

No debe usar el CSS para lograrlo, pero haga una actualización en serie para mantener esos cambios en la configuración del gráfico.

 events: { checkboxClick() { this.update({ opacity: 0.5 }) } },

Eche un vistazo a este enfoque: https://jsfiddle.net/BlackLabel/b4n0z5k8/

API: https://api.highcharts.com/class-reference/Highcharts.Series#update

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda