批次数据标签 [英] Flot Data Labels

问题描述

我正在尝试使用Flot生成折线图，但是我希望数据标签显示在图表上-意思是，我希望每个点的值都显示在该点旁边.我觉得这应该是一个选择，但是在API中找不到它.我只是缺少什么，还是有人知道解决方法?

I'm trying to produce a line chart using Flot, but I want the data labels to show up on the chart - meaning, I want the value of each point to appear next to that point. I feel like this should be an option, but can't find it in the API. Am I just missing something, or does someone know a workaround?

谢谢.

推荐答案

以下是我添加功能的方法，包括令人愉快的动画效果:

Here is how I added the feature, including a pleasant animation effect:

var p = $.plot(...);

$.each(p.getData()[0].data, function(i, el){
  var o = p.pointOffset({x: el[0], y: el[1]});
  $('<div class="data-point-label">' + el[1] + '</div>').css( {
    position: 'absolute',
    left: o.left + 4,
    top: o.top - 43,
    display: 'none'
  }).appendTo(p.getPlaceholder()).fadeIn('slow');
});

您可以移动位置并在样式表中显示CSS.

You can move the position and display css to a stylesheet.

这篇关于批次数据标签的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！