我绘制了一个带有长标签的 flot pie 聊天,结果很难看,我认为可以将标签显示在远离饼图或饼图下方的位置。我使用的 javascript 是
function onSuccess(series) {
var tickLabels = [];
var pieData= [];
for (var i =0;i<series.length;i++){
tickLabels.push([i,series[i][0]]);
var obj = {};
obj['label']=series[i][0];
obj['data']=series[i][1];
pieData.push(obj);
series[i][0] = i;
}
var data = [series];
var pieArea = $("#pieChart");
pieArea.css("height", "400px");
pieArea.css("width", "600px");
$.plot( $("#barChart"), data, {
series: {
bars: {
show:true,
barWidth: 0.5,
align: "center"
},
points: {
show: true
}
},
grid: {
hoverable: true,
clickable: true
},
xaxis: {
labelWidth:12,
labelAngle: 45,
ticks: tickLabels
}
} );
图表
有没有人知道解决这个问题的办法
最佳答案
您可以使用 CSS 将图例放在不同的容器中并将其放置在任何您想要的位置。
legend: {
container: '#graphLegend'
}
来自 API 文档:
If you want the legend to appear somewhere else in the DOM, you can specify "container" as a jQuery object/expression to put the legend table into. The "position" and "margin" etc. options will then be ignored. Note that Flot will overwrite the contents of the container.
我更新了Mark's fiddle来证明这个替代方案。
关于javascript - 带有长标签渲染问题的 flot 饼图,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18465146/