En Flot, ¿es posible eliminar u ocultar las marcas de cuadrícula sin eliminar la etiqueta correspondiente?

StackOverflow https://stackoverflow.com/questions/169894

  •  05-07-2019
  •  | 
  •  

Pregunta

La documentación de la API Flot describe los amplios ganchos de la biblioteca para personalizar los ejes de un gráfico. Puede establecer el número de ticks, su color, etc. por separado para cada eje. Sin embargo, no puedo encontrar la manera de evitar que Flot dibuje las líneas verticales de la cuadrícula sin quitar también las etiquetas del eje x. He intentado cambiar las opciones tickColor, ticks y tickSize sin éxito.

Quiero crear hermosos gráficos compatibles con Tufte como estos:

http://www.robgoodlatte.com/wp-content/uploads/2007/05/tufte_mint .gif http://www.argmax.com/mt_blog/archive/RealGDP_graph.jpg

Encuentro que las marcas verticales en mis gráficos son basura de gráficos. Estoy trabajando con una serie temporal que estoy mostrando como barras verticales, por lo que las marcas verticales a menudo cortan las barras de una manera que es visualmente ruidosa.

¿Fue útil?

Solución

Como señaló Laurimann, Flot continúa evolucionando. La capacidad de controlar esto se ha agregado a la API (como se señaló en el problema de flot con el que Nelson se vinculó).

Si descarga la última versión (que todavía tiene la etiqueta 0.6), puede deshabilitar las líneas en un eje con " tickLength " ;, así: 

xaxis: {
  tickLength: 0
}

Bastante molesto, esta adición no se ha actualizado en la documentación de la API.

Otros consejos

Esta publicación llega dos años más tarde que OP y Flot (ahora versión 0.6) podría haber evolucionado mucho durante ese tiempo o tal vez hay mejores opciones que las que existen, pero en cualquier caso, aquí está mi contribución.

Accidentalmente me encontré con una solución alternativa para este problema: configure el canal alfa del color de marca de la cuadrícula como totalmente transparente. Por ejemplo: 

var options =   {
      grid:   {show: true,
               color: "rgb(48, 48, 48)",
               tickColor: "rgba(255, 255, 255, 0)",
               backgroundColor: "rgb(255, 255, 255)"}
    };

Funciona para mí.

Después de investigar un poco, estoy bastante seguro de que no es posible a través de la API Flot. Sin embargo, si se ensucia mucho, podría hacerlo: he publicado una versión modificada de un ejemplo que lo hace. Ver fuente muestra toda la fealdad.

Para evitar ticks en las opciones, solo da ticks: [] en el eje correspondiente

A partir de junio de 2009 hay problema de flot 167 , que es una solicitud para esta característica exacta. Incluye dos implementaciones y un acuerdo del autor del flot de que es una buena idea.

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top