1

您好,我正在使用 d3 js 和数据地图,我想展示世界上少数几个国家。我已经检查了在线论坛的帮助,但没有得到明确的想法或回应。

源代码 :

<div id="container" style="position: relative; width: 900px; height: 500px;"></div>

<script src="http://cdnjs.cloudflare.com/ajax/libs/d3/3.5.3/d3.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/topojson/1.6.9/topojson.min.js"></script>
<script src="http://datamaps.github.io/scripts/0.4.4/datamaps.world.min.js"></script>

<script>
var map = new Datamap({
        element: document.getElementById('container'),
        fills: {
            HIGH: '#afafaf',
            LOW: '#123456',
            MEDIUM: 'blue',
            UNKNOWN: 'rgb(0,0,0)',
            defaultFill: 'green'
        },

        dataType: 'json', //for use with dataUrl, currently 'json' or 'csv'. CSV should have an `id` column
    dataUrl: null,
    geographyConfig: {
        dataUrl: null, //if not null, datamaps will fetch the map JSON (currently only supports topojson)
        hideAntarctica: true,
        borderWidth: 1,
        borderOpacity: 1,
        borderColor: '#FDFDFD',
        popupTemplate: function(geography, data) { //this function should just return a string
          return '<div class="hoverinfo"><strong>' + geography.properties.name + '</strong></div>';
        },
        popupOnHover: true, //disable the popup while hovering
        highlightOnHover: true,
        highlightFillColor: '#FC8D59',
        highlightBorderColor: 'rgba(250, 15, 160, 0.2)',
        highlightBorderWidth: 2,
        highlightBorderOpacity: 1
    },
        done: function(datamap) {
            datamap.svg.selectAll('.datamaps-subunit').on('click', function(geography) {
                console.log(geography);
                var url = window.location.href;
                var arr = url.split("/");
                var result = arr[0] + "//" + arr[2]
                window.open(result+'/countries/view/'+geography.properties.name);
            });
        }

    });
</script>

它将显示所有国家/地区。但我想展示几个国家。我怎样才能通过那里的国家名单?我认为在 custom.json 或 topojson 的帮助下。我不知道。如果您有任何解决方案或指导,请告诉我。

4

0 回答 0