Getting Started
Highmaps is Highcharts for geo maps. Mainly choropleth maps where the color intensity relates to some value of a geographic area, but Highmaps also supports different features like lines (roads, rivers etc.) and points (cities, points of interest) and more. Highmaps comes in two flavors, either as a standalone JavaScript file, or as a plugin for Highcharts.
LOAD THE REQUIRED FILES
For basics, see Highcharts installation. The framework requirements and installation is the same for Highmaps as for Highcharts. To load Highmaps as a standalone product (if you dont have a license for Highcharts), include this script tag:
lt;script src='http://code.highcharts.com/maps/highmaps.js'gt;lt;/scriptgt;
If you already have Highcharts installed in the web page and want to run Highmaps as a plugin, include this script tag afterhighcharts.js:
lt;script src='http://code.highcharts.com/maps/modules/map.js'gt;lt;/scriptgt;
LOAD THE MAP
Highmaps loads its maps from GeoJSON, an open standard for description of geographic features. Most GIS software supports this format as export from for instance Shapefile or KML export. Read more in the API reference and see the live demo.
There are three basic sources for your map:
- Use our Map collection. Read the tutorial article on the map collection to get started.
- Find an SVG map online and convert it using our (experimental) online converter.
- Create your own map from scratch using an SVG editor, then convert them online. Read our tutorial on Custom maps for Highmaps.
INITIALIZE THE MAP
Read more on initializing a chart in Your first chart. If youre running Highmaps as a jQuery plugin, the map is constructed with 'Map' as the first argument:
$(#container).highcharts(Map, {
...
});
Otherwise, use the Highcharts.Map constructor like this:
var chart = new Highcharts.Map(container, {
...
});
Or, to avoid the new keyword, use the Highcharts.mapChart constructor:
Highcharts.mapChart(container, {
...
});
ADD AND JOIN DATA
Once the empty map is in place, were ready to add the data to the series.data option. For the joining to work, each data point must have some identifier that relates to the same identifier in the map data set. This or these identifiers are then specified in the joinBy option. See detailed documentation and examples there.
Another way to join the data is to simply skip the mapData and set the path directly on the data point. This mixes the data and the structure and is not generally recommended, but it performs faster, and may be considered in situations where you have static data and a backed to perform the joining.
Map navigation
Highmaps supports different ways of navigating around the map - zooming, panning, zooming to an area etc. The API options related to this can be viewed at mapNavigation.
Please note that mapNavigation is disabled by default because the implementer should be concious that it may interfere with the navigation of the web page in general. When scrolling the mouse wheel over a map, the user may expect the web page to scroll, while Highmaps will capture the mousewheel event and zoom the map. The same goes for touch devices, where unless used right, the map may trap the user unable to zoom out to the page outside the map. So zooming should only be enabled in cases where the map actually needs it.
BUTTONS
Two buttons, [ ] and [-], are by default shown on each map when navigation is enabled. These provide zooming in and zooming out.
MULTITOUCH
On touch devices, zooming and panning may be performed by pinch and touch-drag gestures.
MOUSEWHEEL
Mousewheeling zooms in and out the map around the point under the mouse.
DOUBLECLICK
Doubleclick by default zooms in, focused on the point under the mouse. Following the enableDoubleClickZoomTo option, double clicking may zoom fully in to a specific point.
PROGRAMMATIC
The map may be zoomed programmatically through the Chart.mapZoom or Point.zoomTo methods.
Color axis
The values on a choropleth geo map or heat map are plotted against a color axis. The Highmaps color axis is a special case of an axis that is drawn inside the legend, displaying a gradient or single items depending on whether the axis is scalar or has data classes. See detailed reference and live examples in the API.
SCALAR AXIS
<p
剩余内容已隐藏，支付完成后下载完整资料</p
入门指南
Highmaps是Highcharts的地理地图模块。大体上，分级统计图绘制地图，其颜色强度涉及地理区域的某些值，但是Highmaps也支持不同的特征，像线（公路、河流）、点（城市、兴趣点）等等。Highmaps 通过两种方式使用，要么作为一个独立运行的JavaScript文件，要么作为Highcharts的一个插件。
加载被要求的文件
有关基础知识，请参阅Highcharts安装。Highmaps的框架要求与安装和Highcharts是相同的。要将Highmaps作为独立产品加载（如果你没有一个Highcharts许可证），请添加此script标签：
lt;script src=”http://code.highcharts.com/maps/highmaps.js”gt;lt;/scriptgt;
如果您已经在网页中安装了Highcharts，并希望运行Highmaps作为插件，请将此脚本标签包含在afterhighcharts.js中：
lt;script src=”http://code.highcharts.com/maps/modules/highmaps.js”gt;lt;/scriptgt;
加载地图
Highmap从GeoJSON加载其地图，GeoJSON是一个开放标准，用于描述地理特征。 大多数GIS软件支持这种格式，例如从Shapefile或KML导出导出。 在API参考资料中阅读更多内容，并参阅现场演示。
您的地图有三个基本来源：
- 使用我们的Map集合。开始在这个Map集合上阅读教程文章。
- 在线查找SVG地图并使用我们的（实验性）在线转换器进行转换。
- 使用SVG编辑器从头创建自己的地图，然后在线转换。 阅读我们的高分辨率自定义地图教程。
初始化地图
在你的第一张图表中阅读更多关于初始化图表。 如果您将Highmaps作为jQuery插件运行，则使用“Map”作为第一个参数构建地图：
$(#container).highcharts(Map, {
...
});
否则，像这样使用Highcharts.Map构造函数：
var chart = new Highcharts.Map(container, {
...
});
或者，为了躲避新的关键词，使用Highcharts.mapChart构造函数：
Highcharts.mapChart(container, {
...
});
添加并且结合数据
一旦一张空的地图生成，我们就可以将数据添加到series.data选项。为了这个结合，每个数据点必须具有与地图数据集中的相同标识符相关的一些标识符。然后在joinBy选项中指定这个或这些标识符。 查看详细的文档和示例。
另一种添加数据的方式只是跳过地图数据并且直接在数据点上设置路径。这种方式混合了数据和结构，通常不推荐这种方式，但其执行起来更快，所以当你有静态数据并支持执行连接的情况下，或许考虑这种方式。
地图导航
Highmaps支持不同的导航方式 - 缩放，平移，缩放到区域等。可以在mapNavigation中查看与此相关的API选项。
请注意，默认情况下，mapNavigation是禁用的，因为通常实施者应该意识到它可能和网页界面的导航相联系。当在地图上滚动鼠标的时候，用户可能期望这个网页界面滚动，而不是Highmaps获取鼠标滚动事件并且缩放地图。触摸设备也是如此，与之相同的是触摸设备，除非正确使用，否则地图可能限制用户使其不能缩小地图以外的界面。因此，图像缩放应该仅被用于地图确实需要它的情况。
按钮
两个按钮，[ ]和[-]，默认情况下被显示在每张地图上，当导航可用的时候。这两个按钮提供放大和缩小地图的功能。
多触摸
在触摸设备上，缩放和平移可以通过捏和触摸手势进行拖动。
鼠标滚动
在鼠标（屏幕上的停留处）周围滚动缩放地图
双击
默认情况下，双击鼠标放大位置（鼠标点击的位置）。根据enableDoubleClickZoomTo选项，双击可能完全放大一个指定的点。
编程
编程中，通过Chart.mapZoom或者Point.zoomTo方法，地图可以被缩放。
颜色坐标轴
在分级统计地理地图或者热点图上，这些值按照颜色坐标轴绘制。Highmaps的颜色坐标轴是坐标轴的一个特殊的实例。它被绘制在图例内部，展示了一个梯度或单一的项，其取决于该坐标轴是否是一个分级的或拥有数据类。在API中查看详细的参考和实例。
标准轴
标量色轴由梯度表示。 颜色范围在minColor和maxColor之间，或者对于更细粒度的控制，可以在停止中定义颜色。 通常，需要调整颜色轴以获得数据的正确颜色扩展。 除了停止之外，请考虑使用对数轴类型，或设置最小和最大值以避免由异常值确定的颜色。
数据类
当使用dataClasses时候，范围被细分为不同的类别，比如基于它们的值的类别。对于两个值之间的范围来说，它能够被使用，对于一个真正的类别来说更是如此。然而，当你的数据被分类的时候，为方便起见，它可能为一个独立的系列添加范围。
地图集合
为了方便以及最佳使用Highmaps，Highmaps提供了一个免费的地图集合。对于常见的地图，它减少了寻找或者绘制合适的可缩放矢量图形（SVG）或GeoJSON地图的麻烦。取而代之的是，你可以在数百个预先生成的国家、地区以及其他管理层次地图之间选择。
许可证
Highmaps Map Collection包含源数据的许可证。 对于Admin0（国家）和Admin1（美国国家，德国联邦，荷兰等地区），源数据是“自然地球”，即“公有领域”。 对于Admin2，我们只编译选定的国家/地区，这些地图是由具有自己的许可证的国家文件创建的，这些许可证是在SVG地图上指定的，而在其他格式文件中是以元数据形式。 如果您的国家从列表中缺少，请与我们联系，我们将尝试找到合适的shapefile并生成更多的地图。
对于使用默认的GeoJSON输入地图数据选项的地图来说，一个版权的短版本将会打印在表格的credits标签中。
使用地图集合
在地图集合参考中，每一个地图名字后边都有一个例子的链接。以查看这个例子的来源开始。简而言之，地图的GeoJSON版本被加载到页面的一个script标签中。然后GeoJSON对象被注册到Highcharts.maps对象中并且在表格设置中应用到地图数据（mapData）选项中。
添加地图作为一个JavaScript元素：
lt;script src='http://code.highcharts.com/mapdata/custom/world.js'gt;lt;/scriptgt;
在http://code.highcharts.com/mapdata/1.1/custom/world.js中,你可以可选地联系一个地图指定的版本或者子版本。
2.在series.mapData中加载：
mapData: Highcharts.maps[custom/world],
可选地，你可以用chart.map选项为所有系列设置默认地图：
map: custom/world
3.把你的数据和地图结合起来。默认情况下，Highmaps设置绘制数据违反地图集合的hc-key属性，允许你像这样定义你的数据：
data: [[us-ny, 0], [us-mi, 5], [us-tx, 3], [us-ak, 5]]
对于其他的数据结合选项，查看series.joinBy选项和series.keys选项。
地图属性
下面的表格概述了Highmaps中地图集合的地图以及它们的意思。属性可以从point.properties对象中使用。
属性 实例值 描述 适用范围
|
hc-group |
Admin1,admin2,special |
该区域所属的管理组。 Admin0是国家，admin1是第一级行政部门（美国国家，德国联邦州，加拿大省）。 Admin2是二级adm.div。 （美国县，德国Kreise，挪威公民）。 “特殊”用于表示这种分组没有意义的区域（例如，国会区，历史地图）。 |
所有地图 |
|
hc-middle-x |
0.65 |
数据标签X的位置。定义为地图边框宽度分数。0是左对齐，1是右对齐 |
所有地图 |
|
hc-middle-y |
0.65 |
数据标签Y的位置。定义为地图边框盖度分数。0是定不对其，1是底部对齐。 |
所有地图 |
|
hc-key |
Us,us-ma-027,gb-hi |
独一无二的等级标识符。在下面更加详细的描述 |
所有地图 |
|
hc-a2 |
KV,PA,BB |
区域名称的两个字母缩写。常与邮政编码/ISO代码相同但不总是。不保证在地图内唯一。 |
所有地图 |
|
name |
Fremont,Brandenburg,Saipan |
地区的名字 |
所有地图 |
|
iso-a2 |
US,MC,LV |
ISO 2字母国家代码 |
大多数admin0区域 |
|
iso-a3 |
USA,MCO,LVA |
ISO 3字母国家代码 |
大多数admin0区域 |
|
continent |
亚洲，北美 |
大陆的区域在内 |
大多数admin0区域 |
|
country-abbrev |
Pan,C.R |
缩写的国家名称 |
大多数admin0区域 |
|
region |
中西部，南部，高低和群岛 |
区域位于的区域 |
国家地图中的大多数admin1区域 |
|
subregion |
北欧以及高地 |
区域所在的子区域 |
大多数admin0区域以及admin1区域 |
|
fips |
120，GM10，US05，56031 |
该区域的FIPS代码。格式在地图之间可能有所不同，是否包括国家代码。 |
国家地图中的大多数admin1区域，以及美国admin2地图 |
|
hasc |
DE.BB,US.AR |
HASC代码的区域 |
国家地图中的大多数admin1区域 |
|
pPostal-code |
AK,NY,TI |
该区域的邮政编码，通常Wie两个字母宽 |
国家地图中的大多数admin1区域 |
|
type |
州，酋长国，Fylke，土地 |
区域类型的描述 |
国家地图中的大多数admin1区域 |
hc-key属性反映了地图的命名习惯，而且能够被用于动态向下的目的。这在Map drilldown演示中被详细解释。该属性按照下面的格式：
lt;u
剩余内容已隐藏，支付完成后下载完整资料
资料编号：[137776]，资料为PDF文档或Word文档，PDF文档可免费转换为Word
以上是毕业论文外文翻译，课题毕业论文、任务书、文献综述、开题报告、程序设计、图纸设计等资料可联系客服协助查找。
