在flot.js中以画布划线的网格线/刻度线

Question

如何在flot.js中的 x轴和 y轴中创建虚线？我不知道图书馆在哪里改变。这是我使用flot.js在画布上生成的图形代码。但是我希望画布上的网格背景上的 x轴和 y轴上的虚线。我尝试markingsStyle: 'dashed'，但这不起作用。

plot = $.plot("#placeholder", [{
            dashes: { show: true },
            data: data,
            color: "rgb(255, 255, 255)",
            label: $("#hidsymbolid").val(),                    
        }, {
            data: dataBaseLine,
            color: "rgb(255, 255, 255)",
            lineStyle: "dashed"
        }
        ], {
            series: {
                lines: {
                    lineWidth: 1,
                    show: true,
                    lineJoin: "round",
                    lineCap: "round"
                },
                points: {                    
                    show: false
                }
            },
            grid: {
                hoverable: true,
                backgroundColor: {
                    colors: ["#3B3B3B", "#3B3B3B"]
                },                 
                markingsStyle: 'dashed'
            },         
            xaxis: {
                show: true,
                tickSize: parseFloat((maxvalue - minvalue) / 6),
                min: minvalue,
                max: maxvalue,
                dashes: { show: true },
                timeformat: "%H:%M:%S",              
                tickColor: "rgb(255, 255, 255)",            
            },
            yaxis: {
                show: true,
                dashes: { show: true },
                color: "rgb(255, 255, 255)",
                alignTicksWithAxis: 2               
            }
});

Answer 1

请试一试。

<强> setLineDash（[5]）

示例： -
      var context = document.querySelector("canvas");
  var cxt = context..getContext('2d');
  cxt.beginPath();
  cxt.setLineDash([9]);
  cxt.rect(30,15,100,100);
  cxt.stroke();