GIS可视化——热点图 - 追梦的远远

本邮件内容由第三方提供，如果您不想继续收到该邮件，可 点此退订 。

GIS可视化――热点图 - 追梦的远远  阅读原文»

一、简介

SuperMap iClient for JavaScript提供了热点图（HeatMapLayer），用于渲染数据衰减趋势、颜色渐变的效果。

• 原理：在客户端直接渲染的栅格图，热点图的渲染需要三大要素：1、热点数据，热点数据需要点数据，每一个热点数据需要有地理位置以及权重值 （能够明显的表现某位置某事件发生频率或事物分布密度等，如可以为温度的高低、人口密集度等等）；2、热点衰减渐变填充色集合， 用于渲染每一个热点从中心向外衰减时的渐变色；3、热点半径，也就是衰减半径。每一个热点需要从中心点外四周根据半径计算衰减度， 对在热点衰减区内的每一个像素计算需要渲染的颜色值，然后进行客户端渲染。
• 特点：可以通过颜色用图示化方法来表达二维离散数据的分布，并且可以呈现每一个离散点的权重值的衰减趋势和离散点之间的衰减叠加。
• 应用场景：由于热点图的衰减是像素级别的，视觉效果方面极佳，但不能与具体数据进行一一对应，只能表示权重之间的差别，所以可以用于一些对精度要求不高 而需要重点突出权重渐变的行业，如可以制作气象温度对比动态效果图、地震区域的震点强弱图等。

二、使用

1、创建热点图图层

首先创建一个热点图对象。由于热点图是对矢量点数据的渲染，不能作为底图，初始化只需要设置一个图层的名称即可。

//创建一个名为“heatMap”的热点图层。
heatMapLayer = new SuperMap.Layer.HeatMapLayer("heatMap");

2、添加到地图

然后将此图层添加到map里面。

//向map中添加图层
map.addLayers([heatMapLayer]);

3、添加数据

首先需要获取一个点数组（SuperMap.Feature.Vector数组）， 数据可以从服务器查询，也可以使用本地数据，不过都只能是点数据。 如下的形式：

var heatFeatures = [feature1,feature2,......,featureN];

这些features首先必须是点数据，每一个 feature 必须满足在attributes属性中存在记录权重的值。 如我们可以这样初始化feature：

var heatFeature = new SuperMap.Feature.Vector(
new SuperMap.Geometry.Point(
Math.random()*360 - 180,
Math.random()*180 - 90
),
{
"value":Math.random()*9
}
);

这里的value就是记录权重的字段，当每一个feature数据带上权重数据后， 我们还需要让layer知道如何读取这些数据，所以需要告诉layer读哪一个字段：

heatMapLayer.featureWeight = "value";

再把所有的features添加进layer

heatMapLayer.addFeatures(heatFeatures);

然后我们就可以获得如下热点图的效果了：

4、自定义颜色

虽然上面的效果很好，但是颜色渐变是固定的，下面我们就试着自己来设置颜色的渐变

我们可以给属性items赋值一个分段颜色数组以此来设置颜色渐变。如下：

var items = [
{
start:0,
end:1,
startColor:new SuperMap.REST.ServerColor(170,240,233),
endColor:new SuperMap.REST.ServerColor(180,245,185)
},
{
start:1,
end:2,
startColor:new SuperMap.REST.ServerColor(180,245,185),
endColor:new SuperMap.REST.ServerColor(223,250,177)
},
{
start:2,
end:3,
startColor:new SuperMap.REST.ServerColor(223,250,177),
endColor:new SuperMap.REST.ServerColor(224,239,152)
},
{
start:3,
end:4,
startColor:new SuperMap.REST.ServerColor(224,239,152),
endColor:new SuperMap.REST.ServerColor(160,213,103)
},
{
start:4,
end:5,
startColor:new SuperMap.REST.ServerColor(160,213,103),
endColor:new SuperMap.REST.ServerColor(44,104,50)
},
{
start:5,
end:6,
startColor:new SuperMap.REST.ServerColor(44,104,50),
endColor:new SuperMap.REST.ServerColor(29,135,59)
},
{
start:6,
end:7,
startColor:new SuperMap.REST.ServerColor(29,135,59),
endColor:new SuperMap.REST.ServerColor(118,154,49)
},
{
start:7,
end:8,
startColor:new SuperMap.REST.ServerColor(118,154,49),
endColor:new SuperMap.REST.ServerColor(204,175,27)
},
{
start:8,
end:9,
startColor:new SuperMap.REST.ServerColor(204,175,27),
endColor:new SuperMap.REST.ServerColor(198,63,2)
}

];
heatMapLayer.items = items;

这样我们就实现了自己的颜色渐变：

这样我们就可以使用热点图功能了，完整范例请见

http://www.supermap.com.cn:8090/iserver/iClient/forJavaScript/examples/heatmapLayer.html

http://www.supermap.com.cn:8090/iserver/iClient/forJavaScript/examples/heatmapColorSection.html

http://www.supermap.com.cn:8090/iserver/iClient/forJavaScript/examples/heatmapColorManual.html

本文链接：GIS可视化――热点图，转载请注明。

解读ASP.NET 5 & MVC6系列（17）：MVC中的其他新特性 - 汤姆大叔  阅读原文»

（GlobalImport全局导入功能）

默认新建立的MVC程序中，在Views目录下，新增加了一个_GlobalImport.cshtml文件和_ViewStart.cshtml平级，该文件的功能类似于之前Views目录下的web.config文件，之前我们在该文件中经常设置全局导入的命名空间，以避免在每个view文件中重复使用@using xx.xx语句。
默认的示例如下：

@using BookStore
@using Microsoft.Framework.OptionsModel
@addTagHelper "*, Microsoft.AspNet.Mvc.TagHelpers"

上述代码表示，引用BookStore和Microsoft.Framework.OptionsModel命名空间，以及Microsoft.AspNet.Mvc.TagHelpers程序集下的所有命名空间。

关于addTagHelper功能，我们已经在TagHelper中讲解过了

注意，在本例中，我们只引用了BookStore命名空间，并没有引用BookStore.Controllers命名空间，所以我们在任何视图中，都无法访问HomeController类（也不能以Controllers.HomeController的形式进行访问），希望微软以后能加以改进。

获取IP相关信息

要获取用户访问者的IP地址相关信息，可以利用依赖注入，获取IHttpConnectionFeature的实例，从该实例上可以获取IP地址的相关信息，实例如下：

var connection1 = Request.HttpContext.GetFeature<IHttpConnectionFeature>();
var connection2 = Context.GetFeature<IHttpConnectionFeature>();

var isLocal = connection1.IsLocal; //是否本地IP
var localIpAddress = connection1.LocalIpAddress; //本地IP地址
var localPort = connection1.LocalPort; //本地IP端口
var remoteIpAddress = connection1.RemoteIpAddress; //远程IP地址
var remotePort = connection1.RemotePort; //本地IP端口

类似地，你也可以通过IHttpRequestFeature、IHttpResponseFeature、IHttpClientCertificateFeature、 IWebSocketAcceptContext等接口，获取相关的实例，从而使用该实例上的特性，上述接口都在命名空间Microsoft.AspNet.HttpFeature的下面。

文件上传

MVC6在文件上传方面，给了新的改进处理，举例如下：

<form method="post" enctype="multipart/form-data">
<input type="file" name="files" id="files" multiple />
<input type="submit" value="submit" />
</form>

我们在前端页面定义上述上传表单，在接收可以使用MVC6中的新文件类型IFormFile，实例如下：

[HttpPost]
public async Task<IActionResult> Index(IList<IFormFile> files)
{
foreach (var file in files)
{
var fileName = ContentDispositionHeaderValue
.Parse(file.ContentDisposition)
.FileName
.Trim('"');// beta3版本的bug，FileName返回的字符串包含双引号，如"fileName.ext"
if (fileName.EndsWith(".txt"))// 只保存txt文件
{
var filePath = _hostingEnvironment.ApplicationBasePath + "\\wwwroot\\"+ fileName;
await file.SaveAsAsync(filePath);
}
}
return RedirectToAction("Index");// PRG
}

同步与推荐

本文已同步至目录索引：解读ASP.NET 5 & MVC6系列

本文链接：解读ASP.NET 5 & MVC6系列（17）：MVC中的其他新特性，转载请注明。

阅读更多内容