Tip*_*tan 3 javascript jquery charts flot
我正在使用Flot Chart作为我的条形图......我正在使用顶部的图表值指示器...
var p1 = $.plot($("#received-against-assigned"), data1, {
xaxis: {
ticks : ticks,
axisLabel: "Accounts",
axisLabelUseCanvas: true,
axisLabelFontSizePixels: 12,
axisLabelFontFamily: "Verdana, Arial, Helvetica, Tahoma, sans-serif",
axisLabelPadding: 10
},
yaxis: {
axisLabel: "Emails",
axisLabelUseCanvas: true,
axisLabelFontSizePixels: 12,
axisLabelFontFamily: "Verdana, Arial, Helvetica, Tahoma, sans-serif",
axisLabelPadding: 5
},
grid: {
hoverable: true,
clickable: false,
borderWidth: 0
},
legend: {
// labelBoxBorderColor: "none",
// position: "left"
show: true,
noColumns: 5,
container: "#bar-legend-2"
},
series: {
shadowSize: 1
},
tooltip: true
});
Run Code Online (Sandbox Code Playgroud)
这是指标的代码......
$.each(p1.getData()[0].data, function(i, el){
var o = p1.pointOffset({x: el[0], y: el[1]});
$('<div class="data-point-label">' + el[1] + '</div>').css( {
position: 'absolute',
left: o.left - 32, // Notice here...
top: o.top - 20,
display: 'none'
}).appendTo(p1.getPlaceholder()).fadeIn('slow');
});
Run Code Online (Sandbox Code Playgroud)
现在你可以看到我正在设置left: o.left - 32这是一个静态的方式...我有可变数量的条... ...取决于帐户的数量...所以数字32不够好...
如果我能以某种方式获得当前的条宽......那么我可以正确地计算和对齐指标......
谢谢...
从中获得条宽(以轴为单位)
var barWidthInUnits = p1.getOptions().series.bars.barWidth;
Run Code Online (Sandbox Code Playgroud)
如果要以像素为单位计算宽度,还需要获取x轴的比例因子
var barWidthInPixels = barWidthInUnits * p1.getXAxes()[0].scale;
Run Code Online (Sandbox Code Playgroud)
其中一半应该是您的价值指标所需的抵消.
| 归档时间: |
|
| 查看次数: |
1106 次 |
| 最近记录: |