Javascript 元素内的每次移动都未激活悬停/鼠标悬停

我正在使用Chartjs v.1.0.2，并试图设置一个点，使其仅出现在悬停在当前点上时。同样的问题是当我使用悬停或鼠标悬停时。当前点可通过

getPointsAtEvent（e）找到但只有当我将鼠标移出画布，然后将其返回时，它才起作用，而不是当我在画布内移动时。每次我在画布元素中移动鼠标时，它是如何工作的

window.onload = function(){

        var ctx = $("#chart1").get(0).getContext("2d");
                var chart1 = new Chart(ctx).Line(data1, options);


                $("#chart1").hover(function(e) {
                    var activeBars = chart1.getPointsAtEvent(e); 
                    activeBars[0].display = true;
//                    console.log(activeBars[0]);
                    chart1.update();
                 });

    };

    var data1 = {
            labels: ["January", "February", "March", "April", "May", "June", "July"],
            datasets: [
                {
                    label: "My First dataset",
                    fillColor: "rgba(95,186,88,0.7)",
                    strokeColor: "rgba(95,186,88,1)",
                    pointColor: "rgba(95,186,88,1)",
                    pointStrokeColor: "#fff",
                    pointHighlightFill: "#fff",
                    pointHighlightStroke: "rgba(220,220,220,1)",
                    data: [65, 59, 80, 81, 56, 55, 40]
                }
            ]
    };



var options = {
    responsive: true,
    bezierCurve : false,
    scaleShowLabels: false,
    scaleFontSize: 0,
    pointDot : false,
    scaleBeginAtZero: true,
    scaleShowHorizontalLines: false,
    scaleShowVerticalLines: true,
    scaleGridLineColor : "rgba(232,232,232)",
    showTooltips: true,

    customTooltips: function (tooltip) {
        var tooltipEl = $('#chartjs-tooltip');

        if (!tooltip) {
            tooltipEl.css({
                opacity: 0
            });
            return;
        }

        tooltipEl.removeClass('above below');
        tooltipEl.addClass(tooltip.yAlign);

        // split out the label and value and make your own tooltip here
        var parts = tooltip.text.split(":");
        var innerHtml = '<span>' + parts[0].trim() + '</span> : <span><b>' + parts[1].trim() + '</b></span>';
        tooltipEl.html(innerHtml);

        tooltipEl.css({
            opacity: 1,
            left: tooltip.chart.canvas.offsetLeft + tooltip.x + 'px',
            top: tooltip.chart.canvas.offsetTop + tooltip.y + 'px',
            fontFamily: tooltip.fontFamily,
            fontSize: tooltip.fontSize,
            fontStyle: tooltip.fontStyle,
        });
    }

};

window.onload=function（）{
var ctx=$（“#图表1”）.get（0.getContext（“2d”）；
var chart1=新图表（ctx）.Line（数据1，选项）；
$（“#图表1”）。悬停（函数（e）{
var activebar=chart1.getPointsAtEvent（e）；
活动条[0]。显示=true；
//console.log（activebar[0]）；
图表1.update（）；
});
};
变量数据1={
标签：[“一月”、“二月”、“三月”、“四月”、“五月”、“六月”、“七月”]，
数据集：[
{
标签：“我的第一个数据集”，
填充颜色：“rgba（95186,88,0.7）”，
strokeColor:“rgba（95186,88,1）”，
点颜色：“rgba（95186,88,1）”，
pointStrokeColor:“fff”，
pointHighlightFill:“fff”，
pointHighlightStroke:“rgba（2201）”，
数据：[65,59,80,81,56,55,40]
}
]
};
变量选项={
回答：是的，
贝塞尔曲线：错，
scaleShowLabels:false，
scaleFontSize:0，
点点：错，
scaleBeginAtZero:对，
缩放水平线：false，
scaleShowVerticalLines：没错，
scaleGridLineColor:“rgba（232232）”，
showTooltips:true，
自定义工具提示：函数（工具提示）{
var tooltipEl=$（“#chartjs工具提示”）；
如果（！工具提示）{
工具管道({
不透明度：0
});
返回；
}
工具管道removeClass（“上下”）；
tooltipEl.addClass（tooltip.yAlign）；
//拆分标签和值，并在此处创建自己的工具提示
var parts=tooltip.text.split（“：”）；
var innerHtml=''+parts[0]。trim（）+：'+parts[1]。trim（）+''；
html（innerHtml）；
工具管道({
不透明度：1，
左：tooltip.chart.canvas.offsetLeft+tooltip.x+'px'，
顶部：tooltip.chart.canvas.offsetTop+tooltip.y+'px'，
fontFamily:tooltip.fontFamily，
fontSize:tooltip.fontSize，
fontStyle:tooltip.fontStyle，
});
}
};

简化的
好的，我明白了你的问题，只需将pointDot值设置为true，如下所述：

pointDot : true,

在var选项中

就是这样：）
将
pointDot
选项设置为true

...
pointDot : true,
...

然后将序列的
pointColor
和
pointStrokeColor
设置为透明，将
pointHighlightFill
和
pointHighlightStroke
设置为非透明值，如下所示

...
    pointColor: "rgba(0,0,0,0)",
    pointStrokeColor: "rgba(0,0,0,0)",
    pointHighlightFill: "rgba(95,186,88,1)",
    pointHighlightStroke: "rgba(95,186,88,1)",
...


Fiddle-
您正在测试哪个浏览器？我可以看到它在firefoxFirefox上运行正常，但在任何情况下都不能正常工作。它只在我离开画布并再次输入时显示点点，在我移动画布元素时，它应该显示不同的点。这是故意的错误：）我希望它们隐藏，以便默认情况下它们不可见，而只是一条干净的线，然后悬停时只显示一个点。如果是真的，所有的点都是可见的。。。