作者信息
刘远刚 1、何振明 1、龙英波 1、李深宏 2、蔡永祥 1、马小雅 1、东方 3
（1.长江大学地球科学学院，湖北武昌 430100；2.武汉大学测绘遥感国家重点实验室，湖北武昌 430079；3. 61541部队，北京 100094）
”
【摘要】针对Web环境下统计专题图在线定制的需求以及ArcGIS JS API在绘制统计专题图时存在样式缺乏、制作复杂等缺点，提出了一套在线专题图定制技术。被提议。 该方法将ArcGIS Server发布的地理地图、ArcGIS JS API实现的专题视口、ECharts控件绘制的统计图表符号进行叠加渲染，实现各类统计专题图的在线绘制，填补了ArcGIS JS API绘制的空白。统计专题地图。 的不足。 JSON（JavaScript Object Notation）文件用于描述各种专题图的绘制参数，形成标准化的专题图模板库。 在此基础上，实现了基于代码编辑器和基于JQuery图形界面控件的两种交互定制方法。 ，从而为用户提供了一套友好、灵活的统计专题地图在线定制工具。
[关键词] 在线统计专题图； 地图定制； ArcGIS JS API； 埃图表
【中文图书馆分类号】P285.1 【文献识别码】A 【文章编号】1672-1586（2020）03-0095-05
”
引用格式：刘远刚，何振明，龙英波，等。 基于ArcGIS JS API和ECharts的在线统计专题地图定制方法初探[J]. 地理信息世界，2020，27(3):95-99。
文本
0前言
大数据时代，各行业的数据量呈现爆发式下降。 如何有效利用这些数据资源对信息进行深度加工，探索其内在规律，为社会发展提供强有力的决策支持是当前的研究热点。 由于大多数数据都具有自然的空间特征echarts 散点图地图，在使用它们进行专业分析时，往往需要制作各种专题图。 由于传统GIS软件在专题图制作上存在样式少、制作复杂等局限性，如何在网络环境下简单高效地实现专题图绘制仍然是制图界追求的目标。 因此，许多新理论、新方法、新技术应运而生。 目前专题地图的理论和技术研究倾向于建立知识规则库和案例库，利用人工智能技术建立整体的测绘服务模型，模拟专家的思维，生成针对不同测绘情况的专题地图。 在技术方面，人们提出了多种专题地图制图模型，如注重数据处理的本体驱动模型、注重制图过程的以任务流为中心的设计模型、注重用户的以用户为中心的制图模型等。需求和以地图为中心的模型。 模板设计符号以设计模式为中心。 这些设计模式有效提高了在线专题地图绘制的自动化程度和交互性，为在线专题地图的商业化和普及应用奠定了坚实的基础。 尽管如此，目前网络上发布的在线专题地图交互定制产品并不多。 代表性的有ESRI的“地图故事”、SuperMap的“地图智慧”、高德的“高德个性化”等。 “地图”，大多数地图软件开发商只提供专题地图的二次开发插座，这对于大众应用来说并不容易。 而且，现有产品在专题地图符号的设计以及专题地图定制的灵活性和多样性方面仍需要优化。 本文针对Web环境下在线交互式专题地图定制和发布的需求，讨论基于ArcGIS JS API（ArcGIS JavaScript应用程序编程接口）与ECharts相结合的专题地图定制方法，希望利用ECharts的统计表达能力图表符号。 其优点弥补了ArcGIS JS API在描绘统计专题图方式上的不足。
1技术方案
本文专题地图定制的总体技术方案如图1所示，采用三层架构，包括客户端、Web服务器和数据层。 客户端负责提供地图定制和发布的操作接口，向服务器发起地图请求，完成专题地图勾画等功能。 Web服务器是整个系统的核心。 主要负责响应客户端的地图请求，提供数据加载、数据查询、地图数据与模板集成、地理底图获取、专题图生成等功能。 专题图生成模块将地图数据与专题图模板集成，形成JSON（JavaScript Object Notation）格式的专题图描述文件并发送给客户端。 客户端根据文件内容调用ArcGIS JS AP和ECharts控件，实现专题图的在线描绘。 并浏览。 数据层为整个系统提供数据源，包括地理底图服务数据和通过ArcGIS Server发布的属性数据。 属性数据包括数据库数据和用户自己加载的文件数据。
图1 整体技术方案结构
图1 系统总体技术框架
系统使用的关键技术包括：ArcGIS JS API、ECharts、AJAX（异步JavaScript和XML）和JSON格式等。常用专题图的轮廓是通过ECharts和ArcGIS JS API的结合来实现的。 JSON 文件用于参数化各种专题图的表示，作为客户端和服务器绘图参数之间交互的标准格式。 在此基础上，系统客户端提供友好的图形界面，供用户动态编辑这些参数，从而实现Web环境下专题地图的交互式定制。 整个系统使用AJAX技术在客户和服务器之间进行通信。
2基于ArcGIS JS API和ECharts的专题图圈定
2.1 统计专题图视口分类及其提纲思路
常用的专题图表示方法有定点符号法、质量基法、极差法、定位图法、点数法、层次统计图法、分区统计图法等十多种。 JS API可以支持以上多种表示方式，但对于统计图表等专题图的支持还不够。 目前还没有能够直接实现现实中广泛应用的分区统计、定位等专题图轮廓的编程接口。 因此，本文使用统计图表控件ECharts作为ArcGIS JS API的扩展模块来实现专题地图中统计图表符号的圈定，并将该统计图表符号与ArcGIS圈定的地理底图和专题视口叠加，以实现专题地图中统计图表符号的圈定。包含统计图表符号的各种专题图如图2所示。为了描述方便，本文将ArcGIS勾勒出的专题视口称为原生专题视口。
图2 专题地图视口分类及其叠加形式
图2 专题图图层分类与叠加
2.2 原生专题视口及其属性数据的动态绑定
ArcGIS原生专题视口可以实现的表现方法包括层次统计图、质量基法专题图、范围法专题图、散点图、热力图等。相关的socket包括ClassBreaksRenderer、UniqueValue-Renderer、DotDensityRenderer、HeatmapRenderer ，具体调用方法请参考官方帮助文档。
采用这种方式绘制时，需要使用ArcGIS Server发布的地图要素的某个属性数组作为数据源，这极大地限制了专题图的可定制性。 在实际应用中，专题属性数据具有较强的时效性echarts 散点图地图，往往以较短的周期不断更新。 相反，地图要素的图形数据更新周期通常需要较长的时间。 它们由 ArcGIS Server 作为要素视口发布，并用作专题地图的背景底图。 如果使用API提供的方法勾画原生视口，则需要将专题属性数据输入到地图元素的属性表中。 这样，每次更新属性数据时，都必须编辑并重新发布整个地图元素集，大大增加了成本。 这提高了专题制图的自动化并降低了数据维护成本。
为了解决这个问题，本文将地图图形数据和属性数据分开存储，但为每个地图对象分配唯一的标识符ID，实现图形和属性记录的关联，并在绘制时实现它们的动态绑定。 技术思路如图3所示。ArcGIS Server发布的地图要素服务提供的地图对象在ArcGIS JS API中用一个称为graphics的图形链表来表示。 其中存储的每个JavaScript对象都包含对应的地图对象的坐标和几个属性数组。 这些属性数组与已发布地图要素的属性表数组一一对应。 专题图API通过读取图形和属性值来完成专题符号的渲染。 如果能够将属性库中获取的数据作为新的属性数组添加到这些对象中，就可以实现属性数据与图形属性的动态绑定。 JavaScript对象的属性可以动态添加、修改和删除。 基于这些特点，可以在客户端动态添加ArcGIS JS API封装的图形链表中地图对象的属性数组并添加形式参数，从而实现空间数据和专题属性数据的动态关联。
图3 图文数据与专题属性数据动态绑定
图3 图文数据与专题属性数据的动态绑定
2.3 概述统计图表视口
为了快速实现专题地图中统计图表符号的勾画功能，本文采用ECharts作为地图中统计图表视口的渲染引擎。 ECharts是一套HTML5统计图表控件库，可以在浏览器上绘制各种动态图表，并且可以与各种数据源高度集成。 制作的统计图表形式多样、生动直观、多样化程度高，能够满足统计的需要。 专题图中勾画各种图表符号的要求，避免了自下而上设计符号库的巨大工作量。 整个控件库是用JavaScript实现的，可以与ArcGIS JS API无缝集成。 与以往基于服务器端图表控件的统计专题图符号绘制解决方案相比，该方法可以有效减轻服务器负担和网络负载，提高应用程序的整体运行效率。
使用ECharts实现统计图表视口绘制的具体绘制流程如图4所示。首先，客户端通过AJAX请求获取地图数据和地图符号参数，并将获取到的JSON格式数据转换为JavaScript对象。 然后填写到统计图表的轮廓参数中，然后调用图表轮廓方法，根据样式参数和属性值的大小，为每个地图元素按百分比规格勾勒出一个统计图表符号，并放入对应透明窗口（DIV容器）中。 最后将窗口定位到地图上相应的位置（如地图特征的中心点）。
图4：统计图表视口勾勒流程
图4 统计图表图层绘制流程
地图上统计图表符号的大小反映了它们所代表的数值的大小。 因此，统计图表符号的大小需要根据它们所表达的值的大小来估计为百分比。 符号规格与数值之间的关系分为绝对连续百分比关系和条件连续百分比关系两种。 由于地图中各个实体的属性数据可能有很大差异，使用绝对连续百分比会导致符号规格差异巨大，影响地图的协调性。 因此，本文在绝对连续比例关系的基础上对它们进行对数运算，实现条件连续百分比关系。 据此，分别给出面积符号（如饼图）和宽度符号（如条形图）的符号基线估计公式：
式中，R为当前区域符号的直径宽度（基线宽度）； L为当前宽度符号的宽度（基线宽度）； rmax为图中允许的最大面积符号的直径宽度； 图中lmax为最大允许直径。 宽度符号的宽度； Vcur为当前属性值； Vmax是最大属性值。 需要强调的是，由于人眼具有最小可辨别尺寸，因此当符号的估计基线尺寸大于某个阈值时，该符号将被丢弃。 该阈值需要根据应用中的具体要求来设置。
3基于地图模板文件交互式定制专题地图
3.1 专题图模板文件设计
采用地图模板设计模式，针对目前常用的专题地图表示方法，构建了一套专题地图模板库，可支持质量基数法、极差法、层次统计法、点位法等多种表示方法。数值法、统计图表法，在应用中可以灵活组合多个模板生成新的图形。 专题图模板是对固定专题图模式的参数化描述。 描述内容包括地图标题、图例、地理底图、专题数据指标（属性数组）、符号样式等，制图时只需将专题数据指标对应的数据加载到模板中即可实现数据驱动自动专题制图和地图内容实时更新。 为了方便在网络环境下信息的表达和交换，系统采用JSON文件格式来描述这些专题图模板。 JSON 是一种完全独立于语言的轻量级文本格式。 它也是 JavaScript 原生格式。 因此，在JavaScript中处理JSON数据不需要任何特殊的API或工具包，这可以为本系统的Web端功能的实现带来很大的好处。 非常方便。
专题图模板文件大致包括两部分：①原生专题视口参数。 原生专题视口参数提供基于ArcGIS JS API实现层次统计图法、质量基法、点值法等表示方法所需的各种特征参数； ② 统计图表视口参数。 统计图表视口参数用于描述饼图、条形图、圆环图、玫瑰图、折线图等统计图表符号的样式、大小、数据字段等特征。如图5所示，取模板以全省北部边缘资源分布专题图文件中某县年粮食产值专题图为例，右侧描述了采用分层统计方法的原生专题视口的相关参数，包括统计数组（ClassField）、分级区间（ClassBreaks），每个区间定义对应的分割点（值）、填充符号（样式）等； 左边是统计图表视口的参数设置，如图表类型（ChartType）、最大交易品种规格（InitialSize）、图表数据字段（ChartSeriesField），这些参数与ECharts控件中对应参数基本一致，所以可以调用ECharts来实现统计图表符号的轮廓。
图5 地图模板参数定义示意图
图5 地图模板参数定义
3.2 专题地图交互定制
在互联网环境下，在线代码编辑器可以作为用户与产品交互的快速通道。 ECharts的图表在线示例测试界面、W3school的在线示例学习页面等网站都为用户提供了直接在线编辑代码的窗口，并会编辑结果。 实时反馈让用户直观地了解当前代码的含义。 借鉴这些方法，本文设计了一种使用代码编辑器在线交互式定制专题地图的解决方案。 由于这些方法需要用户具备一定的编程能力，因此被称为“高级交互定制”。
本文使用CodeMirror插件作为地图模板文件的在线编辑器。 CodeMirror 是一组用 JavaScript 编写的开源控件。 使用时只需在.js文件中添加引用程序即可。 为了达到治疗效果，如图6所示，地图定制模块在代码编辑窗口中显示地图模板文件的内容。 用户只需点击刷新按钮即可直接更改模板内容，系统也会使用代码编辑器中的设置更新当前设置。 对于地图的显示效果，用户可以反复调整模板的内容，直到获得满意的地图显示效果。 此时，点击保存按钮，系统会将原来模板文件的内容替换为当前代码编辑中的内容，从而更新地图模板文件。
图6 在线代码编辑器实现地图交互定制功能
图6 基于在线代码编辑器的地图定制
对于没有编程基础的用户来说，使用代码编辑器定制地图是比较困难的。 因此，文中还使用客户端JQuery控件来实现图形界面的地图定制功能。 与代码编辑器相比，交互性更强，更人性化，如图7所示。交互式定制专题地图时，客户端根据获取的地图模板文件内容动态创建JQuery控件，从而将参数显示在模板进入地图定制界面。 在定制界面中，用户只需更改控件中的参数即可快速配置地图模板文件。
图7 基于JQuery插件实现地图交互定制功能
图7 基于JQuery的地图定制
4。结论
本文阐述了如何基于ArcGIS JS API和ECharts图表控件实现专题地图在线定制，可以实现常用统计专题地图的在线定制和发布，为专题地图展示应用提供高效可行的解决方案。 通过本文提出的方法表明：
1）使用ArcGIS JS API勾勒专题视口时，通过动态绑定地图要素属性数据和图形数据，实现地图要素数据的实时更新和扩展，增强地图的可定制性。
2）以统计图表控件ECharts为引擎，在各种专题图中绘制统计图表符号，极大丰富了ArcGIS JS API的专题图表示方法。
3）使用JSON文件描述各种常用的专题图绘制参数，可以生成标准化的专题图模板库，为Web环境下专题图的交互定制奠定基础。 下一步将继续扩展模板库专题地图类型，优化地图定制流程和交互界面，提高系统的实用性。
作者简介：刘元刚（1982-），男，湖北钟祥人，副教授，博士，硕士生导师，主要从事地理信息科学教学和科研工作。
邮箱：liuygis@foxmail.com
本期回顾
时空大数据与新型城镇化研究
·
·
·
·
·
·
理论研究
·
·
·
·
·
创新应用
