Question

这可能要求太多了。我在世界上大多数国家都有灰色线条图。我已经实现了鼠标悬停效果，当用户将鼠标悬停在线上时，一条线以红色突出显示，并在移动时回落到默认灰色。

现在，我希望用户能够点击折线图中的一行，只要用户再次点击它就会突出显示。但mouseOut功能明显阻止了“保持红色突出显示”。不知何故，一旦用户点击该行，就应该在该行上附加一个标志，该标志正在mouseOut函数中进行检查。

像

这样的东西

    click: function()
    {
        this.graph.attr('stroke', '#FF0000');
        if (this.graph.attr('flag').value === "clicked")
        {
            this.graph.attr('flag', '');
        }
        else
        {
            this.graph.attr('flag', 'clicked');
        }
    },
    mouseOver: function()
    {
        this.graph.attr('stroke', '#FF0000');
    },
    mouseOut: function() 
    {
        if (this.graph.attr('flag').value === "clicked")
        {
            // do nothing
        }
        else
        {
            this.graph.attr('stroke', 'rgba(100, 100, 100, 0.2)');
        }
    }

Here is a fiddle.

有没有办法为此使用属性？我实际上并不清楚哪些属性可用。

感谢任何提示。

Answer 1

您将自己的flag属性添加到this.graph。然后，您可以检查flag和click事件中的mouseout：

if(!this.graph.flag)
   this.graph.attr('stroke', 'rgba(100, 100, 100, 0.2)');

以下是示例：http://jsfiddle.net/f3rgendb/7/

在Highcharts折线图中点击并保持高亮显示的选项？

1 个答案: