在地图中可视化Neo4j-Spatial数据库

时间:2016-03-25 19:11:41

标签: neo4j geoserver neo4j-spatial

我已经能够将一些shapefile导入Neo4j 2.3.1。 现在如何在地图上查看此数据?

我已经在GeoServer和uDig上尝试过Wiki指令,但是它们都已经过时了,我无法让它工作。

是否有最新教程或其他工具可以解决此问题?

1 个答案:

答案 0 :(得分:0)

我已将neo4j-spatial与Mapbox.js一起用于可视化地图中的几何图形。

对于我的用例,我在neo4j-spatial中索引了美国国会区的几何图形,然后根据用户点击地图的位置查询空间索引,返回最近的区域,包括WKT字符串和Cypher查询的结果。为了在地图中渲染WKT多边形,我编写了一个简单的javascript函数来将其解析为一个点数组,以添加地图注释。

以下是一些相关的代码段:

创建地图并为地图定义点击处理程序:

L.mapbox.accessToken = MB_API_TOKEN;
var map = L.mapbox.map('map', 'mapbox.streets')
  .setView([39.8282, -98.5795], 5);

map.on('click', function(e) {
  clearMap(map);
  getClosestDistrict(e);
});

点击鼠标

/**
  *  Find the District for a given latlng.
  *  Find the representative, commitees and subjects for that rep.
  */
function infoDistrictWithinDistance(latlng, distance) {

  var districtParams = {
    "layer": "geom",
    "pointX": latlng.lng,
    "pointY": latlng.lat,
    "distanceInKm": distance
  };

 var districtURL = baseURI + findGeometriesPath;
 makePOSTRequest(districtURL, districtParams, function (error, data) {

   if (error) {
    console.log("Error");
   } else {
    console.log(data);

   var params = {
    "state": data[0]["data"]["state"],
    "district": data[0]["data"]["district"]
   };

   var points = parseWKTPolygon(data[0]["data"]["wkt"]);

   makeCypherRequest([{"statement": subjectsQuery, "parameters": params}], function (error, data) {

    if (error) {
      console.log("Error");
    } else {
      console.log(data);

      var districtInfo = data["results"][0]["data"][0]["row"][0];
      districtInfo["points"] = points;
      districtInfo["state"] = params["state"];
      districtInfo["district"] = params["district"];
      console.log(districtInfo);

      addDistrictToMap(districtInfo, latlng);
    }
   });
 }
});

将WKT解析为点数组

/**
 *  Converts Polygon WKT string to an array of [x,y] points
 */
function parseWKTPolygon(wkt) {
  var pointArr = [];
  var points = wkt.slice(10, -3).split(",");

  $.each(points, function(i,v) {
    var point = $.trim(v).split(" ");
    var xy = [Number(point[1]), Number(point[0])];
    pointArr.push(xy)
  });

  return pointArr;
}

代码位于this repo。您可以看到简单的地图演示here(只需点击美国的任何地方即可开始)。最近还有一篇关于此示例的博文here