デモ セクションから Highmaps の例を取り上げましたが、ズームインは正常に機能していました。次に、データ オブジェクトを独自のデータに置き換え、世界地図を独自の GeoJSON データに変更しました。
これで、ズームが機能しなくなりました。
このJSFiddleを参照してください。
この時点までのコードを簡素化することができました。
var geoJson = { ... }
var data = [...]
// Initiate the chart
$('#container').highcharts('Map', {
mapNavigation: {
enabled: true,
navigationButtons: true
},
colorAxis: {
min: 1,
max: 1000,
type: 'logarithmic'
},
series: [{
data: data,
mapData: geoJson,
joinBy: ['name', 'name'],
}]
});
ズームを機能させるにはどうすればよいですか?