0

我正在使用 KineticJS 在 HTML5 画布上创建交互式地图，问题是我的地图数据在 geoJSON 中，所以我有多边形坐标而不是多边形点。

这就是我对多边形点的处理方式（根据本教程）

    //Javascript object with map data
    var myMap = {
    'Russia': {
     points: [44,1,397,1,518,2,518,151,515,..............6,43,4,43,4]
    },
    'Azerbaijan': {
     points: [198, 242, 201, 245, 203,..............197, 242]
    },
    'UAE': {
     points: [224,406,225,410,...............225,407]
    }
   };

    //Function to return map data
    function getData() {
    return myMap;
    }

然后使用 KineticJS 多边形对象在 HTML5 画布上绘制地图。

     //store map data in a variable
     var areas = getData();

    //Loop through the map
    for (var key in areas) {
        (function () {
            var k = key;
            var area = areas[key];
            var points = area.points;

            var shape = new Kinetic.Polygon({
                points: points,
                fill: '#fff',
                stroke: '#555',
                strokeWidth: .5,
                alpha: 0.1
              });

            } ());
        }

有人知道我如何使用 geoJSON 坐标实现相同的目标吗？这是 geoJSON 的示例。坐标嵌套在几何对象内。

        {
"type": "FeatureCollection", 
"features": [{ "type": "Feature", "id": 0, 
"properties": { "OBJECTID_1": 29, "OBJECTID": 29, "COUNTY_NAM": "BARINGO", "COUNTY_COD": 30, "Shape_Leng": 5.81571392065, "Shape_Area": 0.88451236881 }, 
"geometry": { "type": "Polygon", "coordinates": [ [ [ 36.028686523000033, 1.276123047000056 ], [ 36.036499023000033, 1.263916016000053 ], [ 36.039306641000053, 1.259887695000032 ],............[ 36.028686523000033, 1.276123047000056 ] ] ] } }
]
}
4

2 回答 2

0

多边形对象接受数据作为数组或点对象，它具有 x 和 y。

var polygonData = coordinates.map( function(cord) {
  return {x:cord[0],y:cord[1]};
})

//excample
array = [[1,2],[3,4],[5,6]]
array.map( function(cord) {
  return {x:cord[0],y:cord[1]};
})
// will return [{x:1,y:2},{x:3,y:4}, {x:5,y:6}]

或者，如果您只想获取一个数组（无 x，y）

var flattened = [[0, 1], [2, 3], [4, 5]].reduce(function(a, b) {
    return a.concat(b);
});
// flattened is [0, 1, 2, 3, 4, 5]
于 2013-02-15T16:25:46.380 回答
0 
  var myArray = new Array();
  for( var level1 in coordinates ){ // for each array in coordinates
       for( var level2 in level1){    // for each array in that array
            for( var number in level2){   // for each number in that array
                myArray.push(number);
            }
       }
  }
  var points = myArray;

也许这是太多的嵌套级别，但这是主要思想：

遍历所有子数组并获取每个子数组中的数字并将它们放入一个新数组中。

于 2013-02-15T14:32:57.627 回答