1.作用:

聚簇类是用于前端显示优化,使POI点要素显示更为美观。大量的Marker距离太近会引起压盖而对浏览或者操作产生不便,因此,一般在超过1K点的时候,用此类。、

2.使用方式:

   1:  // cluster layer that uses OpenLayers style clustering
   2:              clusterLayer = new ClusterLayer({
   3:                "data": photoInfo.data,
   4:                "distance": 100,
   5:                "id": "clusters",
   6:                "labelColor": "#fff",
   7:                "labelOffset": 10,
   8:                "resolution": map.extent.getWidth() / map.width,
   9:                "singleColor": "#888",
  10:                "maxSingles":1999,
  11:                "singleTemplate": popupTemplate
  12:              });
  13:              var defaultSym = new SimpleMarkerSymbol().setSize(4);
  14:              var renderer = new ClassBreaksRenderer(defaultSym, "clusterCount");
  15:   
  16:              var picBaseUrl = "http://static.arcgis.com/images/Symbols/Shapes/";
  17:              var blue = new PictureMarkerSymbol(picBaseUrl + "BluePin1LargeB.png", 32, 32).setOffset(0, 15);
  18:              var green = new PictureMarkerSymbol(picBaseUrl + "GreenPin1LargeB.png", 64, 64).setOffset(0, 15);
  19:              var red = new PictureMarkerSymbol(picBaseUrl + "RedPin1LargeB.png", 72, 72).setOffset(0, 15);
  20:              renderer.addBreak(0, 2, blue);
  21:              renderer.addBreak(2, 200, green);
  22:              renderer.addBreak(200, 1001, red);
  23:   
  24:              clusterLayer.setRenderer(renderer);

25: map.addLayer(clusterLayer);

 

构造函数源码重点:

return declare([GraphicsLayer], {
    constructor: function(options) {
      // options:
      //   data:  Object[]
      //     Array of objects. Required. Object are required to have properties named x, y and attributes. The x and y coordinates have to be numbers that represent a points coordinates.要素对象集合是必要字段。而要素是Json格式,有三个key,x,y,attributes,坐标值之外的属性数据全部放在attributes字段里。
      //   distance:  Number?
      //     Optional. The max number of pixels between points to group points in the same cluster. Default value is 50.该字段是设定两点之间小于多少个像素值就被归类于同一个簇中

默认值是50.
      //   labelColor:  String?
      //     Optional. Hex string or array of rgba values used as the color for cluster labels. Default value is #fff (white).
      //   labelOffset:  String?
      //     Optional. Number of pixels to shift a cluster label vertically. Defaults to -5 to align labels with circle symbols. Does not work in IE.
      //   resolution:  Number
      //     Required. Width of a pixel in map coordinates. Example of how to calculate:
      //     map.extent.getWidth() / map.width
      //   showSingles:  Boolean?
      //     Optional. Whether or graphics should be displayed when a cluster graphic is clicked. Default is true.
      //   singleSymbol:  MarkerSymbol?
      //     Marker Symbol (picture or simple). Optional. Symbol to use for graphics that represent single points. Default is a small gray SimpleMarkerSymbol.
      //   singleTemplate:  PopupTemplate?
      //     PopupTemplate</a>. Optional. Popup template used to format attributes for graphics that represent single points. Default shows all attributes as "attribute = value" (not recommended).
      //   maxSingles:  Number?
      //     Optional. Threshold(阈值) for whether or not to show graphics for points in a cluster. Default is 1000.
      //   webmap:  Boolean?
      //     Optional. Whether or not the map is from an ArcGIS.com webmap. Default is false.
      //   spatialReference:  SpatialReference?
      //     Optional. Spatial reference for all graphics in the layer. This has to match the spatial reference of the map. Default is 102100. Omit this if the map uses basemaps in web mercator.

官方实例在这。点击下载

【ArcGIS for JavaScript api】Clusterlayer聚簇类的更多相关文章

  1. Arcgis for Javascript API下类似于百度搜索A、B、C、D marker的实现方式

    原文:Arcgis for Javascript API下类似于百度搜索A.B.C.D marker的实现方式 多说无益,首先贴两张图让大家看看具体的效果: 图1.百度地图搜索结果 图2.Arcgis ...

  2. ArcGIS For JavaScript API 默认参数

    “esri.config”的是在1.3版中的的“esriConfig”的替代品.如果您使用的是1.2或更低的版本,您应该参阅默认API v1.2和更低的配置.对于版本1.3或更高版本,您可以使用“es ...

  3. 利用Arcgis for javascript API绘制GeoJSON并同时弹出多个Popup

    1.引言 由于Arcgis for javascript API不可以绘制Geojson,并且提供的Popup一般只可以弹出一个,在很多专题图制作中,会遇到不少的麻烦.因此本文结合了两个现有的Arcg ...

  4. arcgis for JavaScript API 4.5与4.3的区别

    arcgis 4.5与4.3区别: 鉴于本人使用4.3时间比较久,而arcgis for JavaScript API于9月28日推出了4.5版本,但是直接更换4.5的init.js会出现意想不到的错 ...

  5. ArcGIS API for JavaScript开发笔记(一)——ArcGIS for Javascript API 3.14本地部署

    堪称史上最详细的< ArcGIS forJavascript API 3.14本地部署>文档,有图有真相~~~ ---------环境:Windows server 2012R2,IIS ...

  6. ArcGIS Server JavaScript API 各命名空间的含义【转】

    1.esri 命名空间      所有的对象都是在 esri 命名空间下的,esri 有自己的属性和方法.      如 esri.version 返回当前 JavaScript API 的版本号.e ...

  7. 【转】基于ArcGIS for javascript api 轨迹回放

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...

  8. ARCGIS FOR JAVASCRIPT API 出现multipleDefine问题

    问题: Error {src: "dojoLoader", info: Object, stack: (...), message: "multipleDefine&qu ...

  9. ArcGIS Server JavaScript API中ESRI字体下载

    ---------------------------------------------------------------------------------- import sys, os im ...

随机推荐

  1. 50个必备的实用jQuery代码段(转)

    1. 如何创建嵌套的过滤器: //允许你减少集合中的匹配元素的过滤器, //只剩下那些与给定的选择器匹配的部分.在这种情况下, //查询删除了任何没(:not)有(:has) //包含class为“s ...

  2. labview事件结构学习

    编程的主要目的是为了实现用户的某种功能,用户通过用鼠标.键盘.程序内部等触发某种程序动作,从而达到某种结果,这些操作都被称作为事件,LabVIEW中相应这些事件最常用的结构就是“事件结构”.事件结构内 ...

  3. Android开发之经常使用的时间格式

    /**   * 获取如今时间   *    * @return 返回时间类型 yyyy-MM-dd HH:mm:ss   */ public static Date getNowDate() {   ...

  4. 超全面的JavaWeb笔记day17<JDBC>

    1.JDBC的原理 是由JavaEE提供的连接数据库的规范 需要由各大数据库的厂商提供对JDBC的实现类 2.四大核心类 3.四大参数 driverClassName url username pas ...

  5. swift--使用 is 和 as 操作符来实现类型检查和转换 / AnyObject与Any的区别

    声明几个类: //动物类 class Animal{ } //陆地动物类 class terricole: Animal { } //海洋动物类 class SeaAnimals: Animal { ...

  6. OpenGL开发环境简介

    基于OpenGL标准开发的应用程序运行时需有动态链接库OpenGL32.DLL.Glu32.DLL,这两个文件在安装Windows NT时已自动装载到C:\WINDOWS\SYSTEM32目录下(这里 ...

  7. vuejs开发环境搭建

    前言:现在前端最火的是3个框架:react,vue,angular.可以说着是哪个框架大大改变了前端的地位.相对于angular来说.vue同样拥有丰富的指令,并且都是典型的MVC框架,但是vue比较 ...

  8. Mybatis之typeAlias配置的3种方法

    1.定义别名: <typeAliases> <typeAlias alias="User" type="cn.lxc.vo.User" /&g ...

  9. Set集合遍历方式

    for(String str : set) { System.out.println(str); } for (Iterator iter = set.iterator(); iter.hasNext ...

  10. poj_2396 有上下界的网络流

    题目大意 一个mxn的矩阵,给出矩阵中每一行的和sh[1,2...m]以及每一列的数字的和目sv[1,2...n],以及矩阵中的一些元素的范围限制,比如a[1][2] > 1, a[2][3] ...