数据可视化交互式地图。捆绑成一个单一的JavaScript文件。
Datamaps 旨在提供一些基于地理数据的数据可视化。它是基于SVG的,可以扩展到任何尺寸的屏幕,包括脚本文件在内的一切。它紧密依赖于d3.js图书馆。 完整文档在这儿: https://github.com/markmarkoh/datamaps
var basic = new Datamap({
element: document.getElementById("basic_map"),
responsive: true,
fills: {
defaultFill: "#DBDAD6"
},
geographyConfig: {
highlightFillColor: '#1C977A',
highlightBorderWidth: 0,
},
});
var basic = new Datamap({
element: document.getElementById("basic_map"),
...
data: {
USA: { fillKey: "active" },
RUS: { fillKey: "active" },
DEU: { fillKey: "active" },
BRA: { fillKey: "active" }
}
});
var usa_map = new Datamap({
element: document.getElementById("usa_map"),
responsive: true,
scope: 'usa',
fills: {
defaultFill: "#DBDAD6"
},
geographyConfig: {
highlightFillColor: '#1C977A',
highlightBorderWidth: 0,
},
...
});
var arc_map = new Datamap({
element: document.getElementById("arc_map"),
...
});
arc_map.arc(
[
{ origin: 'USA', destination: 'RUS'},
{ origin: 'USA', destination: 'DEU'},
{ origin: 'USA', destination: 'POL'},
{ origin: 'USA', destination: 'JAP'},
{ origin: 'USA', destination: 'AUS'},
{ origin: 'USA', destination: 'BRA'}
],
{ strokeColor: '#2BA587', strokeWidth: 1}
);