技术专栏

gis培训

②JavaScript API数据可视化:唯一值符号化(译)

作者:李锐(译) 邮箱:lr@lreis.ac.cn 发布时间:2014-12-08 10:16:31 阅读(1407)

原作者:Jerome Yang(ArcGISResources)

                           

     在本系列文章的第一篇文章中,我们知道通过确认地图的目的来选择数据可视化方式是个不错的办法。除了我们已经在那篇文章中提到的“在哪里”的问题,你还可以关心这些问题:

  1. 我所在的城市中,各家餐厅分别属于什么连锁?

  2. 在美国,各个县区的主要作物分别是什么?

  3. 各选区的犯罪风险等级分别是多少?

唯一值渲染器(Unique value renderer)适用于回答“是什么”一类的问题

唯一值渲染器(unique valuerenderer)根据图层的某一属性字段来为每一个字段值提供不同的符号。在本文例子中,我们将继续使用National Park Service units数据集,在结果地图中每个服务点将根据自己的”type”字段值的不同如“国家公园”“国家历史文物”等显示相应符号。

创建一个唯一值渲染器(uniquevalue renderer)

创建一个唯一值渲染器(unique value renderer)的方法和我们前一篇文章介绍的创建Simplerenderer的方法很类似。关键区别是,需要将一个“字段名”作为额外参数传入UniqueValueRenderer的构造函数。这个字段的值将决定地图中要素用哪种符号来表示。在本文的例子中,我们选择“type”字段。

var symbol = newSimpleMarkerSymbol();
symbol.setColor(new Color("#cccccc"));
var renderer = new UniqueValueRenderer(symbol, "Type");

这个符号(symbol)作为默认符号。

为唯一值定义符号

回答“是什么”类问题的地图的主要目的是:通过图中要素的某个字段的唯一值把要素划分到具有不同共性的逻辑分组中从而更清晰的显示要素。为了达到这个目的,我们需要创建与主题相关的符号(Symbol),并且能够在地图中明显的相互区分。定义符号是一个重复的过程:不断的尝试然后根据反馈修改。

可以使用 addValue()来给”type”字段的每一个唯一值来指定唯一的符号:

var symbol1 = newSimpleMarkerSymbol();
symbol1.setColor(new Color("#ed5151"));
renderer.addValue("National Park", symbol1);

var symbol2 = newSimpleMarkerSymbol();
symbol2.setColor(new Color("#149ece"));
renderer.addValue("National Monument", symbol2);

我们没有必要为每一个唯一值(unique value)指定一个符号(symbol),实际上用户很难区分超过10种的颜色。我们建议只需要为首要的几种类别指定符号即可,然后将其他类别归纳到“其他”组别中。那么其他类别要素将自动获得我们在UniqueValueRenderer构造函数中定义的默认符号。

这里可以查看完整的例子。

我们将多种颜色放到一个地图中后,可能同样需要为应用添加一个图例。这里有个例子:带图例的示例。我们将在下一篇文章中更详细的探讨图例的使用。

进一步试验:将原始数据动态的转换为预定义的类别

源代码

当一个字段有太多的唯一值时,我们很难根据这个字段来实现比较好的可视化。有一个技巧是我们可以将源数据动态的转换为几类我们预先定义好的类别再使用唯一值渲染。例如,不使用”Address”字段的原始值,而是将数据分成如“西太平洋”“大平原”等几类,然后将不同的字段值归到这几类中。你可以利用这个技巧在客户端基于”Address”中州名称将数据进行转换。

动态转换源数据免去了给数据添加并计算一个新的字段的步骤。这个技巧从初始化渲染器(renderer)开始:

var renderer = newUniqueValueRenderer(symbol, function(graphic){
  ...
});

         renderer函数的第二个参数我们不再是传入一个字段名称(string)了而是换成了一个字段值转换的函数。这个函数可以访问图层中的每一个图形(graphic)。每个图形(graphic)包含了需要在地图中展示的所有属性如几何(geometry),属性表(attributes)等。

基于”Address”字段,我们将地址划为两类:“西太平洋”和“其他区域”。使用graphic.attributes['Address']来访问”Address”字段。如果地址简称包括CAOR或者WA那么我们将他划分到“西太平洋”类

var renderer = newUniqueValueRenderer(null, function(graphic){
  if (graphic.attributes['Address'].indexOf("CA") !== -1 ||graphic.attributes['Address'].indexOf("OR") !== -1 ||graphic.attributes['Address'].indexOf("WA") !== -1) {
    return "Pacific West";
  } else {
    return "Other Areas";
  };
});

创建渲染器之后,我们还需要为新的分类提供符号(symbol)

var symbol1 = newSimpleMarkerSymbol();
symbol1.setColor(new Color("#7b3578"));
renderer.addValue("Pacific West", symbol1);

var symbol2 = newSimpleMarkerSymbol();
symbol2.setColor(new Color("#cccccc"));
renderer.addValue("Other Areas", symbol2);

完整应用点击这里。在唯一值渲染器(unique value renderer)中使用函数可以让我们不仅能使用原始数据还可以使用通过这些数据计算得到的新的信息来实现数据的可视化。

文章预告

在后面的文章我们将学习向应用添加弹出框和图例。

作者:李锐(译) 邮箱:lr@lreis.ac.cn

HiGIS技术交流QQ群:336076300

关键词:js api,arcgis,esri,webgis,入门教程,数据可视化,符号化,唯一值

中科地理信息系统培训中心-原创文章
转载请注明出处:www.higis.cn/Tech/tech/tId/81

创新地理知识,共享地理价值

http://www.higis.cn

中科地理信息系统培训中心

关于我们

gis培训

苏州高新区中科地理信息系统培训中心是“国家专业技术人员继续教育基地”指定培训点,是3S方向唯一指定的培训点。同时也是国内唯一获得Esri授权的ArcGIS专业培训与认证机构,为广大用户提供ArcGIS培训、开发和咨询服务,中心已经为中国用户服务20年...详细情况...

联系方式

Email:actc@lreis.ac.cn
苏州总部电话: 0512-68076858
        0512-68075672
北京分部电话: 010-64855687
苏州总部地址:苏州市高新区科灵路78号苏高新软件园5号楼3层
北京分部地址:北京市朝阳区大屯路甲11号中科院地理所2406

顶部 返回
地理信息系统国际培训中心