Highmaps网页图表教程之图表配置项结构与商业受权

Highmaps网页图表教程之图表配置项结构与商业受权

Highmaps图表配置项结构

Highmaps最核心的部分就是图表配置项。用户经过图表配置项来对标题进行定制，从而实现本身所要的效果。因此，掌握图表配置项结构是很是重要。本节将大体讲解结构框架，便于读者后续深刻。

Highmaps基本结构

了解结构的最直接方式，就是看官网API。官方API详细列出了公开的配置项信息。查看官网API有两种方式：

q  第一种是直接访问官网提供的API，网址为http://api.highcharts.com/highmaps，效果如图1.11所示。因为它是国外网站，因此常常会出现访问缓慢的问题。

q  第二种是在下载的Highmaps包中，双击api文件夹下的highmaps.html文件，也能够打开API帮助文档。

图1.11  API帮助页面

在左侧的CONFIGURATION OPTIONS下就是经常使用的配置项。其中，Highcharts.setOptions是一些全局配置项目，包含global和lang两项。其中，配置项lang用于配置一些本地化的一些选项。这部份内容，会在后面具体讲解。

其中，("#container").highcharts("Map", {是咱们最经常使用的选项，具体含义如表1.1所示。

表1.1  经常使用配置项

以上配置项均为顶级配置项。每一个配置项下包含不少子配置项。其中不少子配置项还包括其余配置项目，从而造成层次结构。其中，比较复杂而且经常使用的是配置项plotOptions和series。

经常使用配置项plotOptions和series

配置项plotOptions的结构如图1.12所示。该配置项包括五个子配置项heatmap、map、mapbubble、mapline、mappoint、series。其中，配置项heatmap、map、mapbubble、mapline、mappoint用于设置当前容器中热区图、基础地图、基础地图+气泡类型、基础地图+线条类型、基础地图+节点类型的配置。而series用于设置当前容器中全部数据列的基本配置。

配置项series的结构如图1.13所示。虽然从图中看，彷佛series也分为5类，但实际并非这样的。因为series中的选项较多，但并非每一个配置项都在特定的地图类型中使用。因此为了方便用户查阅，Highmaps将选项按照地图类型从新组织。用户只要根据设置的类型，直接选择对应的类型便可。

图1.12  配置项plotOptions结构                 图1.13  配置项series结构

因为plotOptions.series、plotOptions.*（除plotOptions.series以外）和series的配置项重复，因此相同的设置会有优先级问题。其中，series中的优先级大于plotOptions.*的，plotOptions.*的优先级大于plotOptions.series的。

在实际使用中，尤为是一个容器中包含多个地图类型的时候，合理利用这种优先级，能够减小代码编写量。对于针对全部地图的通用配置，建议经过plotOptions.series设置；对于全部同类型地图的设置，建议经过plotOptions.*设置；针对特定一个地图的设置，建议经过series设置。

Highmaps商业受权

在实际Highmaps开发过程当中，开发者每每会面对受权问题和复杂需求问题。这里针对这两个方面最简要讲解，以帮助开发者更好的使用Highmaps。

Highmaps商业受权

Highmaps是一个很是好的图表插件。在使用的时候，它针对我的和非商业应用是所有免费的。对于商业开发，开发者须要购买相应的商业受权。在国内，开发者能够经过Highmaps官方受权的Higcharts中文网（hcharts.cn）购买商业受权。

该网站是国内最权威的Highmaps技术网站。它提供Highmaps各项服务，如商业受权、定制、咨询等服务。在浏览器中输入网址http://www.hcharts.cn/service/license.php，就能够进入该网站的商业受权网页，如图1.11所示。

图1.11  商业受权页面

按照网页提示，就能够申请购买商业受权。

Highmaps定制开发

在Highmaps中，各种图表的实现采用模版化机制。用户只须要极少的设置，就能够配置精美的图表。但实际开发中，开发者常常面临各类更为复杂的客户需求。这个时候，使用Highmaps提供各类配置项每每很难实现。遇到此类问题，用户能够经过购买定制服务，来解决使用中遇到的难题。

Highcharts中文网提供一流的技术咨询和定制服务，用户只须要进入官网的图表定制服务页面（如图1.12），就能够申请响应的服务。

图1.12  定制服务

本文选自：Highmaps网页图表基础教程大学霸内部资料，转载请注明出处，尊重技术尊重IT人！