Javascript 如何在datalabel上显示鼠标悬停事件的工具提示？

如何在工具栏中的datalabel上显示鼠标悬停事件的工具提示

$(document).ready(function(){
var yAxisLabels = ["Label1", "Label2", "Label3", "Label4"];
var legendValues = ["series1", "series2", "series3", "series4"];
var pLabels1 = ['70%','38%','71%','28%'];
var pLabels2 = ['27%','49%','27%','44%'];
var pLabels3 = ['2%','10%','2%','17%'];
var pLabels4 = ['1%','4%','1%','12%'];
var group4 = [52,528,129,264];
var group3 = [94,1388,394,401];
var group2 = [1446,7130,5591,1004];
var group1 = [3772,5512,14957,633];
    var series = [
                        { pointLabels: { labels: pLabels4 }},
                        { pointLabels: { labels: pLabels3 }},
                        { pointLabels: { labels: pLabels2 }},
                        { pointLabels: { labels: pLabels1 } }];
var plot = $.jqplot('chart', [[[52,1],[528,2],[129,3],[264,4]], [[94,1],[1388,2],[394,3],[401,4]], [[1446,1],[7130,2],[5591,3],[1004,4]], [[3772,1],[5512,2],[14957,3],[633,4]]], {
                stackSeries: true,
                seriesDefaults: {
                    shadow: false,
                    renderer: $.jqplot.BarRenderer,
                    rendererOptions: { fillToZero: true, barDirection: 'horizontal', highlightMouseOver: true},
                    pointLabels: {
                        show: true, stackedValue: true, location: 'w', hideZeros: true
                    }
                },
                axes: {
                     xaxis: {
                        tickOptions: {
                            show: true,
                            mark: 'cross',
                            formatString: "%'d",
                            showGridline: true
                        },
                        min: null,
                        max: null,
                        showTickMarks: true
                    },
                    yaxis: {
                        renderer: $.jqplot.CategoryAxisRenderer,
                        ticks: yAxisLabels
                    }
                },
                grid: {
                    gridLineColor: '#ffffff', /**/
                    borderColor: '#509790',
                    shadowWidth: 0,
                    borderWidth: 0,
                    background: 'rgba(0,0,0,0)',
                    shadow: false
                },              
                series: series
            });
});

---

您可以这样做：

$（“.jqplot点标签”）。悬停（

function（）{

//当你进入数据标签区域时，做一些事情

}，函数（）{

//当您离开数据标签区时，做一些事情

}）

重要的是.jqplot点标签选择器。
我确信有比这更简单/更漂亮/更自然的方法，但使用这一块：

$('.jqplot-point-label').attr('title', 
  function() {
    var seriesNumber = $(this).attr('class').split(' ')[1].split('-')[2];
    return legendValues[seriesNumber]
  }
);

可以定位每个标签，并为其标题属性指定相应的图例值

演示：
在您的示例中，当鼠标超过百分比时，您指的是什么数据标签？你想在工具提示中显示什么？@YuriyGalanter是的我想在工具提示中显示百分比值鼠标悬停在工具栏上你想将百分比显示为工具提示，但在工具栏标签上隐藏它？