Highmaps shared tooltip for overlapping locations

Question

How to display a shared tooltip for the below map if there are two overlapping points.

For example North Glasgow and South Glasgow - I want to be able to use the same or really close geographical location and display one tooltip for both points.

I tried shared and split tooltip option but did not work.

tooltip: {
    headerFormat: '',
    pointFormat: '<b>{point.name}</b><br>Lat: {point.lat}, Lon: {point.lon}',
    shared: true
},

fiddle

Answer 1

Define one point which contains additional information. You can reduce Glasgow points into the one as follows:

 {
        name: 'Glasgow',
        lat: 55.858,
        lon: -4.259,
        subnames: ['South Glasgow', ['North Glasgow']]
    }

And then you have access in a tooltip formatter for the additional information:

    formatter: function (tooltip) {
      const subnames = this.point.options.subnames;
      if (subnames) {
        return `
            <b>${subnames[0]}</b><br>
            <b>${subnames[1]}</b><br>
          Lat: ${this.point.lat}, Lon ${this.point.lon}
        `
      }

      return tooltip.defaultFormatter.call(this, tooltip);
    }

example: http://jsfiddle.net/f9wxu2o7/1/