最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Change cursor on legend after disabling click - Stack Overflow

programmeradmin0浏览0评论

How do i change the cursor to 'default' instead of using 'pointer'?

I disabled my graph using this:

plotOptions: {
    line: {
        events: {
           legendItemClick: function () {
               return false;
           }
        }
     }
 }

But the cursor is the pointer cursor.

How do i change the cursor to 'default' instead of using 'pointer'?

I disabled my graph using this:

plotOptions: {
    line: {
        events: {
           legendItemClick: function () {
               return false;
           }
        }
     }
 }

But the cursor is the pointer cursor.

Share Improve this question asked Nov 2, 2015 at 10:27 yeeenyeeen 4,95512 gold badges53 silver badges74 bronze badges
Add a ment  | 

3 Answers 3

Reset to default 6

I think that the simplest way is using itemStyle and set cursor as default.

legend: {
        layout: 'vertical',
        align: 'right',
        verticalAlign: 'middle',
        borderWidth: 0,
        itemStyle: {
            'cursor': 'default'
        }
    },

Example: - http://jsfiddle/fc8vmarp/1/

You can create a CSS class hover and define the behavior when this class is hovered

.hover:hover {
   cursor: default;
}

Once you created your graph, you can set .hover to the DOM element you want to change the cursor on.

You can use HTML in your data labels as it seems you cannot change the style of the legend with Highcharts options [edit : I'm wrong => itemStyle as Sebastian Bochan has mentioned in its answer].

Here is an example : jsfiddle

    series: [{
        name: '<span style="cursor:default;">Tokyo</span>',
        marker: {
            symbol: 'square'
        },
        data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, {
            y: 26.5,
            marker: {
                symbol: 'url(https://www.highcharts./samples/graphics/sun.png)'
            }
        }, 23.3, 18.3, 13.9, 9.6]

    }, {
        name: '<span style="cursor:default;">London</span>',
        marker: {
            symbol: 'diamond'
        },
        data: [{
            y: 3.9,
            marker: {
                symbol: 'url(https://www.highcharts./samples/graphics/snow.png)'
            }
        }, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
    }]
发布评论

评论列表(0)

  1. 暂无评论