Question

我在设计中为图表分配的空间相当小，如果图表中有超过5个类别，则标签会相互重叠。有办法防止这种情况吗？以下是我遇到的一个示例：http://jsfiddle.net/bCYET/1/

var data = [
    ["Engineering",14],
    ["Communications",11],
    ["Business",9],
    ["Biology",5],
    ["Natural Sciences",2],
    ["Studio Art",2]
];

var options = {
    series: {
        bars: { 
            show: true,
            barWidth: .6,
            align: "center"
        }    
    },
       xaxis: {
           mode: "categories",
           tickLength: 0
       }
}

$.plot('#barchart', [data], options);

更新：我发现我可以将图例放在图表之外的容器中，这对我来说很有用。示例：http://jsfiddle.net/bCYET/2/

Answer 1

目前这是open issue with flot.js。在该页面上的解决方案中，flot-tickrotor可能是最容易使用的。

Answer 2

现在这个问题已在v 0.8.3中修复。使用此：http://www.flotcharts.org/blog/

有没有办法防止xaxis标签在flot.js条形图中重叠？

2 个答案: