Flot Ticks动态创建

Question

我正在使用flot库,并且在正确显示x轴标签时遇到一些问题.

如果我有一个测试数据数组,像这样:

  var textData = ["51% <br> 101 <br> data1", "11% <br> 32 <br> data2", "26% <br> 64 <br> data3"];

然后使用它以这种方式创建x轴标签:

 xaxis: {
            tickLength: 0,
            show: true,
            ticks: [[0, textData[0]], [1, textData[1]], [2, textData[2]]]
        },

工作正常:

这适用于测试一,但是,数据项的数量可能会有所不同,所以我应该动态创建x轴值.我试过这个:

     xaxis: {
                tickLength: 0,
                show: true,
            }
     })

     for (var i = 0; i < textData.length; i++) {
        ticks.push(i, textData[i]);
    }

这将创建图表,但x轴标签将显示不正确:

任何帮助将不胜感激.

Answer 1

设置一个ticks数组以传递您的选项:

var textData = ["51% <br> 101 <br> data1", "11% <br> 32 <br> data2", "26% <br> 64 <br> data3"];
var myTicks = [];
for (var i = 0; i < textData.length; i++)
{
    myTicks.push( [ i, textData[i] ] ); //note the extra brackets, it's an array of arrays
}

然后在你的选择中:

xaxis: {
    tickLength: 0,
    show: true,
    ticks: myTicks
}