jQuery Flotcharts - 显示网格线？

Question

我正在使用 http://www.flotcharts.org/。为什么我的网格线消失了？

这是我的绘图选项的代码：

var options = {
        grid: {
            markings: EVS,
            clickable: true,
            hoverable: true
        },
        series: {
            lines: {
                show: true,
                fill: true,
                lineWidth: 1,
                fillColor: {
                    colors: [{
                        opacity: 1
                    }, {
                        opacity: 1
                    }]
                }
            }
        },
        colors: ["rgba(41, 150, 206, 0.9)", "rgba(67, 90, 110, 0.4)", "rgba(255, 255, 255, 1)"],
        crosshair: {
            mode: "xy",
            color: "#323232",
            lineWidth: 1
        },
        xaxis: {
            mode: mode,
            show: true,
            position: "bottom",
            color: "#323232",
            font: {
                size: 10,
                lineHeight: 15
            },
            labelHeight: 15,
            tickLength: 5
        },
        yaxis: {
            show: true,
            position: "left",
            color: "#323232",
            labelWidth: 20,
            font: {
                size: 10
            },
            max: vmax + 20,
            min: 0,
            minTickSize: 1,
            tickSize:20,
            tickLength: 10
        },
        pan: {
            interactive: true,
            cursor: "move",
            frameRate: 60
        },
        tooltip: true,
        tooltipOpts: {
            id: 'flotTip', //"flotTip"
            content: '%x : %y km/h', //"%s | X: %x | Y: %y"
            shifts: {
                x: 10, //10
                y: 20 //20
            },
            defaultTheme: true, //true
            lines: {
                track: true, //false
                threshold: 0.01 //0.05
            },
            onHover: function (flotItem, $tooltipEl) {
                if (flotItem.seriesIndex == 1) $tooltipEl[0].innerHTML = "Postój";
            }
        }
    };

我只想要简单的 yaxis 线。

PS。十字准线来自十字准线插件。

Answer 1

如果您想在刻度处设置线条，请不要设置 tickLength 选项。 Flot 本身没有 "grid lines"，但可以运行穿过网格的刻度线。如果您只希望它们在一个轴上，请在一个轴上设置选项而不是另一个轴。

来自 documentation（强调我的）：

"tickLength" is the length of the tick lines in pixels. By default, the innermost axes will have ticks that extend all across the plot, while any extra axes use small ticks. A value of null means use the default, while a number means small ticks of that length - set it to 0 to hide the lines completely.

jQuery Flotcharts - 显示网格线？

jQuery Flotcharts - show grid lines?

javascript

jquery

html

charts

flot