js绘图库flot中的自定义刻度

时间:2013-12-17 17:39:31

标签: jquery html flot

我无法通过flot来注册我发送的自定义刻度。我的代码工作正常,但是滴答片仍然显示为flot选择的默认滴答。

HTML:

<div class="flot" id="flotcontainer"></div>';

JS:

var $hist_data = [[1.0, 0],[2.0, 2],[3.0, 1],[4.0, 1],[5.0, 0],[6.0, 1],[7.0, 2],[8.0, 1],[9.0, 1],[10.0, 1]];

var $hist_ticks = [[1.0, 1.0],[2.0, 2.0],[3.0, 3.0],[4.0, 4.0],[5.0, 5.0],[6.0, 6.0],[7.0, 7.0],[8.0, 8.0],[9.0, 9.0],[10.0, 10.0]];



<script type="text/javascript">

    $.plot($("#flotcontainer"), 

        [
          {
            data: $hist_data,

            bars: { show: true, barWidth: 1, fill:0.8},

            color: "#227dda",

            xaxis: {ticks: $hist_ticks}

          }
        ]

    );

</script>

1 个答案:

答案 0 :(得分:2)

您的xaxis属性混乱了。令人困惑的是,数据本身存在xaxis属性,但这只是一个数字,用于指定应该针对哪个轴绘制数据系列。要实际设置轴刻度,您需要使用传递给.plot的选项参数:

$.plot($("#flotcontainer"), [{ 
        data: $hist_data,

        bars: {
            show: true,
            barWidth: 1,
            fill: 0.8
        },

        color: "#227dda"

    }], {xaxis: { ticks: $hist_ticks} }

);

Fiddle