Javascript 如何在Jquery Flot图表中添加标签？

我需要在Jquery Flot图表中添加标签。目前，它只提供了鼠标上的标签，而不是我需要显示的标签后，酒吧。我已经附上了这个问题的图片。在散列（#）的位置，我需要将条形标签放在那里。请给我一个解决办法。 提前谢谢

 for (i = 0; i < bardata.length; i++)  {

            ds.push({
                label: yearArry[i],
                data : bardata[i],
            });

    }
var options = {
        colors : colorArray,
        grid : {
            hoverable : true,
            clickable : true,
            tickColor : $chrt_border_color,
            borderWidth : $chrt_border_width,
            borderColor : $chrt_border_color,
        },
        series: {
            stack:true,
            bars: {
                show : true,
                barWidth : 0.8,
                horizontal: true,
                align: "center"
            }
        },
        xaxis: {
            tickFormatter: function(val, axis) { return val < axis.max ? abbreviateNumber(val) : "Cost"; }
        },
        yaxis: {
            ticks: company_label
        },
        legend: {
            show: showLegend,
            position: "ne",
            noColumns : 1,
            backgroundOpacity: 0.5,
            margin: [0, -70]
        },
        tooltip : true,
        tooltipOpts : {
            content : "<b>%s</b> : <span>$%x</span>",
            defaultTheme : false,
        }
    };

    // Plot the graph with the data and options provided
    $.plot($("#flotchart"), ds, options);

for（i=0；i

正如我所说，在我给出的答案中，我发现自己做这件事最简单

var somePlot = $.plot($("#flotchart"), ds, options);

var ctx = somePlot.getCanvas().getContext("2d");  //canvas context
var series = somePlot.getData();
var xaxis = somePlot.getXAxes()[0];
var yaxis = somePlot.getYAxes()[0];
var offset = somePlot.getPlotOffset();
ctx.font = "16px 'Segoe UI'";
ctx.fillStyle = "black";
for (var i = 0; i < series.length; i++){
    var text = '$' + series[i].data[0][0]; // x data point
    var metrics = ctx.measureText(text);
    var xPos = (xaxis.p2c(series[i].data[0][0])+offset.left);
    var yPos = yaxis.p2c(series[i].data[0][2]) + offset.top + 5; // get positions
    ctx.fillText(text, xPos, yPos); // add the label
} 

var somePlot=$.plot（$（“#flotchart”）、ds、选项；
var ctx=somePlot.getCanvas（）.getContext（“2d”）//画布上下文
var series=somePlot.getData（）；
var xaxis=somePlot.getXAxes（）[0]；
var yaxis=somePlot.getYAxes（）[0]；
var offset=somePlot.getPlotOffset（）；
ctx.font=“16px‘Segoe用户界面’”；
ctx.fillStyle=“黑色”；
对于（变量i=0；i

这是一个与你的代码

---

那么你尝试了什么代码？@Thunda:我已经添加了代码。这是一个很好的解决方案，但是，如果我将红色条的值增加到4，它将超出画布，并且是。你怎么能防止呢？我在Flot图表api中未找到填充。您正在查找axis

autoscaleMargin

属性。更新的fiddle:，设置显式的xaxis max也可以。