如何在flot中获取x轴标签
How to get the x axis labels in flot?
我正在使用Flot创建图形。这是我的代码jsFiddle代码
function drawSeriesHook(plot, canvascontext, series) {
var ctx = canvascontext,
plotOffset = plot.offset(),
labelText = 'VALUE', // customise this text, maybe to series.label
points = series.datapoints.points,
ps = series.datapoints.pointsize,
xaxis = series.xaxis,
yaxis = series.yaxis,
textWidth, textHeight, textX, textY;
// only draw label for top yellow series
if (series.color === '#F8C095') {
ctx.save();
ctx.translate(plotOffset.left, plotOffset.top);
ctx.lineWidth = series.bars.lineWidth;
ctx.fillStyle = '#000'; // customise the colour here
for (var i = 0; i < points.length; i += ps) {
if (points[i] == null) continue;
textWidth = ctx.measureText(labelText).width; // measure how wide the label will be
textHeight = parseInt(ctx.font); // extract the font size from the context.font string
textX = xaxis.p2c(points[i] + series.bars.barWidth / 2) - textWidth / 2;
textY = yaxis.p2c(points[i + 1]) - textHeight / 2;
ctx.fillText(labelText, textX, textY); // draw the label
}
ctx.restore();
}
}
- 在我的drawsseriesHook函数中,我需要获得x轴标签,如Data1、Data2、Data3、Data4
- 有没有任何方法可以在不使用序列的情况下唯一标识最后一个数据项。label&series.color.目前我已经通过修改函数中的series.color来识别它
1。)好的,我想你想为每个小节设置labelText
。在for循环中添加以下行:
labelText = series.xaxis.ticks[i / ps].label;
另请参阅更新后的示例。
2.)您可以将自己的值添加到data
,例如标记最后一个值:
var data = [
{
label : 'Used',
color : '#EF7816',
data : [ [ 1, 85], [ 2, 50 ], [ 3, 18], [ 4, 8 ] ],
last : false
},
...
{
color : '#F8C095',
data : [ [ 1, 12], [ 2, 10], [ 3, 3], [ 4, 2] ],
last : true
}
];
在挂钩中,您可以查看标志:
if (series.last) { ...
另请参阅下一个更新的示例。
相关文章:
- 从模板标签获取html
- 如何从给定的用户和给定的标签中获取所有推文
- 从h1标签获取链接并使图片可下载
- 如何从标题标签获取 A1 表示法的列范围
- 从gmail帐户按标签获取所有消息
- 广告词脚本-按标签获取广告
- 从li标签获取图片来源
- 如何通过标签获取推文
- 量角器通过名称标签获取元素
- 通过aria标签获取HTML元素
- 如何从img标签获取列表SRC
- 从ownerNode(样式标签)获取样式表对象
- 从多个span标签获取标题值
- 从标题标签获取标题
- 从段落标签获取值
- 使用JavaScript从对象标签获取视频Url
- Python:从html的href标签获取javascript文件
- 从锚(a)标签获取本地href值
- 通过点击anchor标签获取anchor的值
- jQuery从动态标签获取属性