はじめに
http://blogs.yahoo.co.jp/dk521123/35443473.htmlhttp://blogs.yahoo.co.jp/dk521123/35446731.html
http://blogs.yahoo.co.jp/dk521123/35450674.html
で、DataMaps のことを書いたが、それ以外の細々したこともメモ。 なお、以下が参考になるhttps://github.com/markmarkoh/datamaps/blob/master/README.md
[1] 地図のデフォルト色を変更する
<script>
var map = new Datamap({
element: document.getElementById('container'),
fills: {
defaultFill: 'skyblue'
}
});
</script>
[2] 特定の国の色を変更する
<script>
var map = new Datamap({
element: document.getElementById('container'),
fills: {
'JPN': 'darkorange',
},
data: {
'JPN': {fillKey: 'JPN'},
}
});
</script>
* 国コードは以下を参照のこと https://www-kokusai.jsps.go.jp/jsps1/kuniList.do
[3] マウスオーバー時のダイアログを非表示する
<script>
var map = new Datamap({
element: document.getElementById('container'),
geographyConfig: {
highlightOnHover: false,
popupOnHover: false
}
});
</script>
[4] 地図の図法を変更する
<script>
var map = new Datamap({
element: document.getElementById('container'),
projection: 'stereographic'
});
</script>
* 地図の図法は以下を参照のこと https://github.com/mbostock/d3/wiki/Geo-Projections
[5] 境界線の幅と色を変更する
<script>
var map = new Datamap({
element: document.getElementById('container'),
geographyConfig: {
borderWidth: 2,
borderColor: 'red',
}
});
</script>
注意
* 「borderWidth: 0,」にしても境界線は消えない
