Я пытаюсь дублировать демонстрации Highmaps Demos> Map bubble, за исключением того, что я хочу добавить другие диаграммы на ту же страницу. Когда я загружаю скрипт Highcharts и скрипт модуля Highmaps, диаграмма не отображает. Браузер выдает общую ошибку. См. Пример jsfiddle.Highcharts + модуль Highmaps не работает
https://jsfiddle.net/hkjbn6wg/1/
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/maps/modules/map.js"></script>
<script src="http://code.highcharts.com/maps/modules/data.js"></script>
<script src="http://code.highcharts.com/mapdata/custom/world.js"></script>
<div id="container" style="height: 500px; min-width: 310px; max-width: 800px; margin: 0 auto"></div>
$(function() {
$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=world-population.json&callback=?', function (data) {
var mapData = Highcharts.geojson(Highcharts.maps['custom/world']);
// Correct UK to GB in data
$.each(data, function() {
if (this.code === 'UK') {
this.code = 'GB';
}
});
$('#container').highcharts('Map', {
chart : {
borderWidth : 1
},
title: {
text: 'World population 2013 by country'
},
subtitle : {
text : 'Demo of Highcharts map with bubbles'
},
legend: {
enabled: false
},
mapNavigation: {
enabled: true,
buttonOptions: {
verticalAlign: 'bottom'
}
},
series : [{
name: 'Countries',
mapData: mapData,
color: '#E0E0E0',
enableMouseTracking: false
}, {
type: 'mapbubble',
mapData: mapData,
name: 'Population 2013',
joinBy: ['iso-a2', 'code'],
data: data,
minSize: 4,
maxSize: '12%',
tooltip: {
pointFormat: '{point.code}: {point.z} thousands'
}
}]
});
});
});
Это работало отлично. Можете ли вы указать мне документацию для этого файла? Я не знаю, как я это пропустил. Благодаря! –
В консоли (инструменты разработчика) появляется сообщение об ошибке. Единственное, что вам нужно, это щелкнуть по этой ссылке, чтобы проверить, что не так с high-картами. –