Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
358 views
in Technique[技术] by (71.8m points)

How to display same data points in a same series in highcharts?

How to display the same data points in the same series in highcharts ?

Please refer below example

https://jsfiddle.net/skoormala/1wq603rs/3/

series: [{
    name: 'Property',
    data: [{"name":"Property 1", "x":1,"y":2}, 
     **{"name":"Property 2", "x":2,"y":5}**,
     **{"name":"Property 5", "x":2,"y":5},**
     {"name":"Property 3", "x":3,"y":6},
      {"name":"Property 4", "x":4,"y":8}]
}]

In the above series property 2 and property 5 has the same coordinates please advise how to display them in a tooltip on mouse hover


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

The tooltip.shared property works only for points with different series, for a single series you can use the pointFormatter function to build a tooltip according to your requirements, for example:

    tooltip: {
        pointFormatter: function() {
            const x = this.x,
                y = this.y;
            const points = this.series.points.filter(p => p.x === x && p.y === y);
            const pointNames = points.reduce(
                (result, point) => ((result ? result + ', ' : '') + point.name),
                ''
            );

            return pointNames + '<br/>' + 'x: ' + x + '<br/>y: ' + y
        }
    }

Live demo: https://jsfiddle.net/BlackLabel/og2jwms0/

API Reference: https://api.highcharts.com/highcharts/tooltip.pointFormatter


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...