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人!

版权声明:本文为博主原创文章,未经博主允许不得转载。

时间: 2024-07-28 15:18:28

Highmaps网页图表教程之图表配置项结构与商业授权的相关文章

?Highmaps网页图表教程之绘图区显示标签显示数据标签定位

?Highmaps网页图表教程之绘图区显示标签显示数据标签定位 Highmaps数据标签定位 由于数据标签是和节点一一对应,所以数据标签是依据节点位置进行定位的.本节详细讲解如何对数据标签进行定位. Highmaps节点定位 在mappoint.mapbubble.mapline图表类型,节点都有明确位置.而在map图表类型中,节点对应的是一个区域.所以,map图表类型的节点中心位置就可以由用户来设定.设置时候需要使用到以下两个配置项: middleX: Number1 middleY: Num

Highmaps网页图表教程之下载Highmaps与Highmaps的地图类型

Highmaps网页图表教程之下载Highmaps与Highmaps的地图类型 认识Highmaps Highmaps是Highcharts的姊妹框架,用来实现地图图表. 它全然使用Javascript编写实现.其结构清晰,使用简单.开发者能够非常轻松地构建出常见的各种地图图表类型. 本章将简要介绍Highmaps的特点.并实现第一个Highmaps地图应用. Highmaps概述 为了更好学习Highmaps的使用.我们首先了解怎样获取Highmaps插件和Highmaps所支持的图表类型.

Highmaps网页图表教程之数据标签与标签文本

Highmaps网页图表教程之数据标签与标签文本 Highmaps数据标签 数据标签用于在地图图表上展现节点对应的数据.数据标签展现数据是静态的,只要节点一加载,数据标签就会出现在节点附近.在Highmaps中,数据标签使用配置项dataLabels进行设置.本章将详细讲解数据标签的使用方式. Highmaps构建数据标签 Highmaps启用数据标签 默认状态下,地图图表均不显示数据标签.用户需要在数据列中启用才可以.这时,需要使用配置项enabled.其语法如下: enabled: Bool

Highmaps网页图表教程之Highmaps第一个实例与图表构成

Highmaps网页图表教程之Highmaps第一个实例与图表构成 Highmaps第一个实例 下面我们来实现本教程的第一个Highmaps实例. [实例1-1:hellomap]下面来制作一个中国地图的图表.操作过程如下: (1)新建一个网页文件,命名为Hellomap.同时将title设置Hello Highmaps.代码如下: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta chars

网页图表Highcharts实践教程之图表代码构成

网页图表Highcharts实践教程之图表代码构成 Highcharts第一个实例 下面我们来实现本书的第一个Highcharts实例. [实例1-1]下面来制作北京连续一周最高温度折线图.操作过程如下: (1)新建一个网页文件,命名为Hello.html.同时,将title设置为Hello Highcharts.代码如下: <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> <head>

网页图表Highcharts实践教程之图表区

网页图表Highcharts实践教程之图表区 网页图表Highcharts图表区 图表区是图表的基本区域.所有的数据和图形都是绘制在图表区中.从图形绘制范围来分,图表区域分为外层图表区和绘图区.本章将详细讲解图表区的设置和创建. 网页图表Highcharts图表区的构成 为了方便管理,Highcharts将所有的图表元素都绘制在一个Box区域内,如图2.1所示.这个区域被称为图表区.由于图表中最重要的数据就是图表图形,所以图表图形所在的区域又构成一个独立的区域,称为绘图区,如图2.1所示. 图2

基于HTML5 Canvas的线性区域图表教程

之前我们看到过很多用jQuery实现的网页图表,有些还是比较实用的.今天我们来介绍一款基于HTML5 Canvas的线性区域图表应用,这个图表应用允许你使用多组数据来同时展示,并且将数据结果以线性图的形式展现,各个数据之间形成的区域用不同的颜色表示,具体可以看下面的DEMO演示. 你也可以在这里查看在线演示 下面我们来简单介绍一下实现这款HTML5图表的过程以及源代码. HTML代码: <canvas id="cvs" width="600" height=&

ActiveReports 报表应用教程 (3)---图表报表

原文:ActiveReports 报表应用教程 (3)---图表报表 ActiveReports 的图表控件支持绝大多数常用的二维和三维图表类型,包括XY图表和财务图表.通过使用图表控件的定制功能,如修改坐标轴.图注.图例等,用户可以创建任何其所需要的图表效果.用户还可以通过代码把定义好的图表输出为多种图像格式. 本文将演示如何在 ActivReports 中实现图文混淆报表. 我们将要实现的是2011年度各类产品销量统计报表,其中图表按照产品类别统计销量,表格按照类别和月份统计销售量.   1

CRL快速开发框架系列教程十(导出对象结构)

本系列目录 CRL快速开发框架系列教程一(Code First数据表不需再关心) CRL快速开发框架系列教程二(基于Lambda表达式查询) CRL快速开发框架系列教程三(更新数据) CRL快速开发框架系列教程四(删除数据) CRL快速开发框架系列教程五(使用缓存) CRL快速开发框架系列教程六(分布式缓存解决方案) CRL快速开发框架系列教程七(使用事务) CRL快速开发框架系列教程八(使用CRL.Package) CRL快速开发框架系列教程九(导入/导出数据) CRL快速开发框架系列教程十(