如何使用流动图向下钻取

Question

我们正在从 highcharts 更改为 flot 图表，这是我第一次使用 flot 图表，但我似乎找不到任何关于使用 flot 图表获得下钻效果的任何内容。

例如;如果我有一个条形图并且用户单击其中一个条形图，图表会转到该类别的更详细视图。

Answer 1

您应该能够将可点击选项添加到网格中，然后在“plotclick”事件中创建详细视图。类似于下面：

这里的小提琴示例：http://jsfiddle.net/jSQ2Y/61/

var plot = $.plot($("#placeholder"), [ m1, m2, m3], {
xaxis : {
    mode          : "time",

    ticks: [1356998400000, 1359676800000, 1362096000000 ],
    timeformat: "%b"

},

grid:{
    clickable:true
    },

series : {
    bars: {
        show: true,


        fillColor : { colors : ["#32b9ff", "#2b78a0"] }
    }
}

});

$("#placeholder").bind("plotclick", function(event, pos, item){
    alert(item.datapoint);
});