各位程序员好!我正在尝试在我的交互式世界地图中添加一个图例,但没有这样做。我应该/可以使用哪些功能?直到现在,我尝试的一切最终都没有显示出来。任何帮助将不胜感激!谢谢!
世界地图代码:
new Datamap({
scope: 'world',
done: function(datamap) {
datamap.svg.selectAll('.datamaps-subunit').on('click', function(geography) {
var country = geography.id
window.country = country
console.log(country);
ScatterCorruption()
Barchart()
});
},
element: document.getElementById('container1'),
fills: {
A: '#c6dbef',
B: '#9ecae1',
C: '#6baed6',
D: '#4292c6',
E: '#2171b5',
F: '#08519c',
G: '#08306b',
defaultFill: 'grey'
},
geographyConfig: {
borderColor: 'rgba(255,255,255,0.3)',
highlightBorderColor: 'rgba(0,0,0,0.5)',
popupTemplate: function(geo, data) {
return data && data.GDP ?
'<div class="hoverinfo"><strong>' + geo.properties.name + '</strong><br/>GDP: <strong> $ ' + data.GDP + '</strong></div>' :
'<div class="hoverinfo"><strong>' + geo.properties.name + '</strong></div>';
}
},
data: {
"ABW": {
"country": "Aruba",
"fillKey": "No data",
"GDP": "No data"
},
"AND": {
"country": "Andorra",
"fillKey": "No data",
"GDP": "No data"
},
"AFG": {
"country": "Afghanistan",
"fillKey": "D",
"GDP": "20038215159.39"
},
"AGO": {
"country": "Angola",
"fillKey": "No data",
"GDP": "No data"
},
"ALB": {
"country": "Albania",
"fillKey": "D",
"GDP": "13211513725.59"
},
"ARE": {
"country": "United Arab Emirates",
"fillKey": "E",
"GDP": "399451327433.63"
},
...
},
});