本文介绍如何从SQLServer数据库获取空间数据，并在Bing地图上绘制边界。通过使用ASP.NET MVC 4创建Web服务，实现地图数据的查询、处理及展示。
Spatial data at the sql server
spatial view:
接下来需要用这些数据在bing map上画出boundary
我使用的是ASP.NET MVC4.
1。在现有项目中添加数据库文件
然后选择generate from database, 连接数据库选择需要连接的table，添加。
添加后的结果。
查看mapdata.Context.cs文件
记住ProSpatialEntities, 这是以后在Controller里连接数据库的方法。
2。新建两个class，在model文件夹下
Response class
public class Response
{
public
List<County> Results { get; set; }
}
County class
public class County
{
public string WKT { get; set; }
public string Name { get; set; }
}
3。在对应的controller里添加以下代码（显示map对应的controller）
protected override JsonResult Json(object data, string contentType, System.Text.Encoding contentEncoding, JsonRequestBehavior behavior)
{
return new JsonResult(){
Data = data,
ContentType = contentType,
ContentEncoding = contentEncoding,
JsonRequestBehavior = behavior,
MaxJsonLength = Int32.MaxValue
};
}
[HttpPost]
public JsonResult MapBoundary(double longitude, double latitude, double radius)
{
Parent models = new Parent();
var nearby = FindNearBy(latitude, longitude, radius);
models.Response = nearby;
return Json(models, JsonRequestBehavior.AllowGet);
}
public Response FindNearBy(double latitude, double longitude, double radius)
{
Response re = new Response();
try
{
double lat2 = latitude - 0.01;
double lon2 = longitude - 0.01;
//here, it must using the same SRID, I used to use 4326, it would return an exception called
//data is null.
DbGeometry point = pe.pvs_14_v1_tracts2010_17.FirstOrDefault().ogr_geometry;
DbGeometry center = DbGeometry.PointFromText("POINT(" + longitude + " " + latitude + ")",
4269);
re.Results = (from k in pe.pvs_14_v1_tracts2010_17
let distance = center.Distance(k.ogr_geometry)
where distance <= radius
orderby distance
select new County
{
Name = k.name,
WKT = k.ogr_geometry.AsText()
}).ToList();
} catch (Exception ex)
{
throw ex;
}
return re;
}
解释：
（1）override Json method详情看exceeding maxJsonLength 文
（2）MapBoundary（）会读取某地点一定范围内的boundary并返回json格式
（3）FindNearBy（）是MapBoundary内部调用的函数，使用Geometry类的相关方法将返回结果限定在一定距离范围内
4。接下来是画地图
这里使用了WKTModule.js
详情请见：https://bingmapsv7modules.codeplex.com/wikipage？title=Well Known Text Reader/Writer
@model MvcApplication6.Models.Response
<body onload="GetMap()" />
<div id="Map">
<div id="myMap" style="position:relative;width:635px;height:470px;"></div>
</div>
<button value="show boundary" id="boundary" onclick="showbound()">show boundary</button>
<button value="clear boundary" id="clearboundary" onclick="clearbound()">clear boundary</button>
<script type="text/javascript">
var map, infobox, dataLayer;
function GetMap() {
map = new Microsoft.Maps.Map(document.getElementById_x_x("myMap"), { center:
new Microsoft.Maps.Location(41.592,-87.332), zoom: 13, credentials: your bingmap credentials here });
dataLayer = new Microsoft.Maps.EntityCollection();
map.entities.push(dataLayer);
var infoboxLayer = new Microsoft.Maps.EntityCollection();
map.entities.push(infoboxLayer);
infobox = new Microsoft.Maps.Infobox(new Microsoft.Maps.Location(0, 0),
{ visible: false, offset: new Microsoft.Maps.Point(0, 20) });
infoboxLayer.push(infobox);
//Register and load the WKT Module
Microsoft.Maps.registerModule("WKTModule", "/Scripts/WKTModule.js");
Microsoft.Maps.loadModule("WKTModule");
}
function CallRESTService(request, callback) {
var xmlHttp;
if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
} else if (window.ActiveXObject) {
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try
{
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch(e) {
throw (e);
}
}
}
xmlHttp.open("GET", request, false);
xmlHttp.onreadystatechange = function (r) {
if (xmlHttp.readyState == 4) {
callback(eval_r('(' + xmlHttp.responseText + ')'));
}
};
xmlHttp.send();
}
function clearbound() {
document.getElementById_x_x("myMap").remove();
$('#Map').append('<div id="myMap" style="position:relative;width:635px;height:470px;"></div>');
GetMap();
}
function showbound() {
var center = map.getCenter();
var lat = center.latitude;
var lon = center.longitude;
$.ajax({
url: '@Url.Action("MapBoundary")',
data: { "longitude": lon, "latitude": lat, "radius": 0.1 },
type: "post",
dataType: "json",
cache: false
})
.done(function (data) {
if(data.Response && data.Response.Results != null) {
for (var i = 0; i< data.Response.Results.length; i++) {
var shape = WKTModule.Read(data.Response.Results[i].WKT);
dataLayer.push(shape);
}
} else if (data.Response && data.Response.Error !=
null) {
alert("Error: " + data.Response.Error);
}
})
.fail(function (xhr) {
alert(xhr.responseText);
});
}
</script>
最后结果：
放大后：
主要参考： http://blogs.bing.com/maps/2013/07/31/how-to-create-a-spatial-web-service-that-connects-a-database-to-bing-maps-using-ef5/
数据来源：http://www.census.gov/geo/partnerships/pvs/partnership14/st17_il.html
（Parse shapefile into sql server会在以后写）
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
