2017-09-20 5 views
0

ハイマップで作業していて、緯度/経度マップのmappointでclickイベントを取得しようとしました。ハイパーマップの緯度/経度マップ上のクリックイベントで

マップポイントでonclickイベントを適用するためのAPIリファレンスはありますか?

コード

// Initiate the chart 
Highcharts.mapChart('container', { 

    title: { 
     text: 'Highmaps basic lat/lon demo' 
    }, 

    mapNavigation: { 
     enabled: true 
    }, 

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

    series: [{ 
     // Use the gb-all map with no data as a basemap 
     mapData: Highcharts.maps['countries/gb/gb-all'], 
     name: 'Basemap', 
     borderColor: '#A0A0A0', 
     nullColor: 'rgba(200, 200, 200, 0.3)', 
     showInLegend: false 
    }, { 
     name: 'Separators', 
     type: 'mapline', 
     data: Highcharts.geojson(Highcharts.maps['countries/gb/gb-all'], 'mapline'), 
     color: '#707070', 
     showInLegend: false, 
     enableMouseTracking: false 
    }, { 
     // Specify points using lat/lon 
     type: 'mappoint', 
     name: 'Cities', 
     color: Highcharts.getOptions().colors[1], 
     data: [{ 
      name: 'London', 
      lat: 51.507222, 
      lon: -0.1275 
     }, { 
      name: 'Birmingham', 
      lat: 52.483056, 
      lon: -1.893611 
     }, { 
      name: 'Leeds', 
      lat: 53.799722, 
      lon: -1.549167 
     }, { 
      name: 'Glasgow', 
      lat: 55.858, 
      lon: -4.259 
     }, { 
      name: 'Sheffield', 
      lat: 53.383611, 
      lon: -1.466944 
     }, { 
      name: 'Liverpool', 
      lat: 53.4, 
      lon: -3 
     }, { 
      name: 'Bristol', 
      lat: 51.45, 
      lon: -2.583333 
     }, { 
      name: 'Belfast', 
      lat: 54.597, 
      lon: -5.93 
     }, { 
      name: 'Lerwick', 
      lat: 60.155, 
      lon: -1.145, 
      dataLabels: { 
       align: 'left', 
       x: 5, 
       verticalAlign: 'middle' 
      } 
     }] 

フィドル - http://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/maps/demo/mappoint-latlon/

上記はhighmapsからの例ですが、私は、緯度/経度のMapPointでイベントをクリックし達成するために、任意のAPIリファレンスを取得できませんでした。

おかげ

+1

使用ポイントのクリックイベント(http://api.highcharts.com/highcharts/plotOptions.series.point.events.click )。例:http://jsfiddle.net/07kwxwo9/。 –

答えて

1

チェック参照plotOptions.series.point.events.click

plotOptions: { 
    series: { 
     point: { 
     events: { 
      click: function() { 
      var text = '<b>Clicked point</b><br>Series: ' + this.series.name + 
       '<br>Point: ' + this.name + ' (lat: ' + this.lat + ' lon:' + this.lon + ')', 
       chart = this.series.chart; 
      if (!chart.clickLabel) { 
       chart.clickLabel = chart.renderer.label(text, 0, 250) 
       .css({ 
        width: '180px' 
       }) 
       .add(); 
      } else { 
       chart.clickLabel.attr({ 
       text: text 
       }); 
      } 
      } 
     } 
     } 
    } 
    }, 

Fiddleデモ

+0

ありがとう、それは私のために働いた。 –

+0

あなたは大歓迎です! –

関連する問題