Question

我创建的2D数组不被D3.js接受为坐标（地图示例我使用的是http://bl.ocks.org/phil-pedruco/6522279。）

以下是事实：

1。）我提供的JSON 输入是一个纬度和经度的字符串（例如"37.3879 -134.96376"）。

2。）所需的输出是一个2D数组，必须采用此格式[[lat,long],[lat,long],...]。

3。）console.log(typeof(lat));返回lat和long值确实是数字（不是字符串）

4。）console.log("Coordinates: " + JSON.stringify(points));返回 [[37.3879,-134.96376],[13.5,-45],...] - 它看起来格式正确，但地图上没有任何点

5.）如果我对数组中的值进行硬编码，则会显示点。

var points = [];
//var dotSpot = [[1.4440, 32.442], [12.222, 4.893]];

window.onload = function () {
    getJSON();
} 

function getJSON(supplierID) {
    //retrieves JSON perfectly
    //calls make() with Supplier data
}

function make(jdata) {

    for (var i = 0; i < jdata.length; i++) {
        //Splits string by space
        var temp = jdata[i].latLong.split(/[ ,]+/)
        //Converts lat and long strings to floats
        var lat = parseFloat(temp[0]);
        var long = parseFloat(temp[1]);
        console.log(typeof(lat)); 

        //Add "curr" coordinates array to "points" array
        var curr = new Array(lat, long);
        points.push(curr);

    }

    console.log("Coordinates: " + JSON.stringify(points)); 
}

Answer 1

您已将坐标指定为[latitude, longitude]。但是，与许多其他应用程序不同，D3使用经度坐标作为第一个值后跟纬度。来自docs：

该点必须以度为单位指定为双元素数组[经度，纬度]。

相应地更改数据应该产生所需的渲染：

var curr = new Array(long, lat);   // instead of new Array(lat, long)
points.push(curr);

2D数组未转换为D3地图坐标

以下是事实：

1 个答案: