在地图中可视化 Neo4j-Spatial 数据库
Visualize Neo4j-Spatial database in a map
我已经能够将一些 shapefile 导入 Neo4j 2.3.1。
现在如何在地图上查看此数据?
我试过 GeoServer 和 uDig 上的 Wiki 说明,但它们都已过时,我无法使用它。
有没有最近的教程或其他工具可以解决这个问题?
我使用了带有 Mapbox.js 的 neo4j-spatial 来可视化地图中的几何图形。
对于我的用例,我在 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. You can see the simple map demo here (just click anywhere in the US to get started). There is also a recent blog post about this example here.
我已经能够将一些 shapefile 导入 Neo4j 2.3.1。 现在如何在地图上查看此数据?
我试过 GeoServer 和 uDig 上的 Wiki 说明,但它们都已过时,我无法使用它。
有没有最近的教程或其他工具可以解决这个问题?
我使用了带有 Mapbox.js 的 neo4j-spatial 来可视化地图中的几何图形。
对于我的用例,我在 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. You can see the simple map demo here (just click anywhere in the US to get started). There is also a recent blog post about this example here.