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. linux gzip 命令详解

    减少文件大小有两个明显的好处,一是可以减少存储空间,二是通过网络传输文件时,可以减少传输的时间.gzip是在Linux系统中经常使用的一个对文件进行压缩和解压缩的命令,既方便又好用. 语法:gzip  ...

  2. Ubuntu下,如何解决Unable to locate package

    在虚拟机上新装了一个ubuntu 12.10,想在上面装一个Git,却发生了以下错误信息 我觉得原因可能是我换了163的源,没有更新所以找不到这个包. 这时候就要使用 sudo apt-get upd ...

  3. spark on yarn(zookeeper 配置)

    http://database.51cto.com/art/201404/435630.htm

  4. 【ML】scikit-learn-book

    http://nbviewer.ipython.org/github/gmonce/scikit-learn-book/tree/master/

  5. Android SDK的安装教程

      Android4.1虽说已经发布了好些天,但由于的我手机比较坑,系统依旧保持在2.3.4.0的都是可望不可即的了,就别说4.1.由于资金的问题,没法换手机,只能另想方法,通过在笔记本上装andro ...

  6. mysql的MyISAM 和 InnoDB 的区别?优化MYSQL数据库的方法?

    MyISAM 和 InnoDB 的基本区别 1.InnoDB不支持FULLTEXT类型的索引. 2.InnoDB 中不保存表的具体行数,也就是说,执行select count(*) from tabl ...

  7. c++ 类数据成员的定义、声明

    C++为类中提供类成员的初始化列表类对象的构造顺序是这样的:1.分配内存,调用构造函数时,隐式/显示的初始化各数据成员2.进入构造函数后在构造函数中执行一般计算  1.类里面的任何成员变量在定义时是不 ...

  8. mybatis由浅入深day02_3一对多查询

    3 一对多查询 3.1 需求(查询订单及订单明细的信息) 查询订单及订单明细的信息. 3.2 sql语句 确定主查询表:订单表 确定关联查询表:订单明细表 在一对一查询基础上添加订单明细表关联即可. ...

  9. laravel 使用验证码

    1)php.ini需要开两个扩展 extension=php_fileinfo.dllextension=php_gd2.dll 2)使用composer安装类包 composer require m ...

  10. string permutation with upcase and lowcase

    Give a string, which only contains a-z. List all the permutation of upcase and lowcase. For example, ...