Maps
Maps
Obtaining Map Data
Declaration
- The vector map data previously provided came from third parties. As some data did not comply with China's "Surveying and Mapping Law," map data is no longer packaged and provided in the IBI release version.
- Since administrative regions are constantly changing, offline map files can easily become outdated. Users with high requirements for map accuracy should apply for map data from relevant authoritative departments.
- Technically, offline regional maps are merely schematic diagrams for blocks, aiming to display data intensity across different areas. Precise boundary data is often very large in volume and slows down network requests. Therefore, contour data simplification is frequently used in map visualization.
Simplified contour data inevitably loses some details. This does not represent any political stance of developers, analysts, or manufacturers. Please do not over-interpret.
- If users have strict usage requirements, please use China Maps (Lon-Lat Maps/Baidu Online Maps). Apply for a paid API key from the Baidu Map Development Platform before use.
Some recommended sources for map information and download configurations: github geoJson-cn
- Download geoJson-cn data and copy the
mapdatafolder to theuser-files/extfolder of IBI.
- Update the regional index: Log in to the IBI platform with an administrator account. In Management -> Chart Configuration -> Regional Map Index, paste the content of the
ext/mapdata/area-code/index.jsonfile.
- Refresh the page to take effect.
- For detailed instructions on operations related to map data, please refer to Custom Regional Map Data.
Further Reading
How Regional Maps Work
Principle
- Map drawing first requires
map datathat complies with standards to draw map contours. The IBI graphics library ECharts uses GeoJSON format data. See specific format. - After having the map contour drawing, the second step is to map your own data onto the map.
- Mapping methods are divided into two types: Regional Mapping and Longitude-Latitude Mapping. Think of the map contour as a coordinate system:
Regional Mappinguses names as a one-dimensional coordinate system.Longitude-Latitude Mappinguses longitude and latitude as a two-dimensional coordinate system.
- Baidu Online Maps do not require
map data. Map contours are drawn through Baidu's online map service, and data mapping uses longitude-latitude mapping.
Description of Several Map Types
| Map Type | Data Query Type | Mapping Method |
|---|---|---|
| Regional Map | Aggregated Data | Region Name |
| 3D Map | Aggregated Data | Region Name, Line Map (Region Name or Lon-Lat) |
| 3D Globe | Aggregated Data | City or Country Name |
| World Map (also a type of regional map) | Aggregated Data | Country Name |
| China Map Local (Lon-Lat Map) | Detail Data | Longitude-Latitude Data |
| China Map (Lon-Lat Map/Baidu Online Map) | Detail Data | Longitude-Latitude Data |
Regional Map
As the name suggests, a regional map maps to the blocks of a map. In the one-dimensional coordinate system using region names as coordinates, if the data name provided by the user matches a block name, that corresponding region is highlighted (visual mapping). The image below shows the default first-level region of China's three-level administrative divisions.
Region Selection
- Region selection. The map's regions can be selected. After selecting a region, to correctly map data onto the map, corresponding regional data must be provided.
China's Three-level Administrative Divisions
The first level includes provinces, municipalities directly under the central government, autonomous regions, and special administrative regions nationwide. The second level includes prefecture-level cities. The third level includes districts/counties/county-level cities.
Layer Level Selection
After users select map data, they can uncheck the Region Auto-Adapt option to select a fixed-level region.
Common Issues
Q: Can I map city regions on a first-level China outline map?
A: No. The blocks of a first-level map are provinces. You can prepare your own map data divided by cities and map city regions through Custom Regional Map.
Alternatively, you can choose to use a Lon-Lat Map, set the Data Type to City, and Display Type to Scatter to achieve the requirement.
Region Drill-down
Region auto-adaptation is used for map drill-down, requiring a hierarchical dimension corresponding to the regional map levels. After checking Region Auto-Adapt, clicking drill-down limits the previous level's data to the clicked region, and that region is used to automatically change the map layer.
China Map Local (Lon-Lat Map)
Region Selection
The region selection for the local China map uses the same map data (geo data) as the Regional Map. The difference is that the Regional Map maps to map blocks, while the Lon-Lat Map maps to points or lines (connecting two longitude-latitude points) on the map.
Data Configuration
Users need to provide longitude-latitude detail data. The data is not aggregated, meaning it's detail data.
Considering that user data may have longitude and latitude combined in one field or longitude and latitude stored separately, we have prepared corresponding data configuration options.
Data Configuration
Q: In longitude-latitude mapping, there is a Name option in the data configuration?
A: We have a built-in dictionary of Chinese city longitudes and latitudes, making it convenient to use the Lon-Lat Map even when only city names are available. Using city names for data mapping requires manual data aggregation.
City Longitude-Latitude Dictionary
(The large JSON dictionary is included here as in the original text. For brevity in this response, the placeholder [City Longitude-Latitude Dictionary Content] is used. The full translation would include the entire dictionary.)
[City Longitude-Latitude Dictionary Content]China Map (Lon-Lat Map/Baidu Online Map)
This map calls the Baidu online map. Data requirements are consistent with the local China map above, requiring network requests to the Baidu Map API. It renders based on detail data (requires applying for a Baidu developer ak).
Process for obtaining a Baidu Map developer key: Click here Note: Commercial use of Baidu Map developer keys requires paying Baidu for permission.
Setting the Developer Key
Add Baidu Map developer calls through extension configuration.
[
[
"script", {
"src": "http://api.map.baidu.com/api?v=2.0&ak=xxxx"
}
]
]Baidu Map Data Configuration
The data configuration is completely consistent with the local map: longitude-latitude mapping, detail data.
Using BMap Advanced Development
BMap provides developers with many powerful layer style control APIs, Baidu Map Open Platform JavaScript API v3.0.
On the IBI platform, users can control this through the developer mode in the afterSetOption function.
afterSetOption = function(chart) {
const map = chart.getModel().getComponent('bmap').getBMap();
var top_left_control = new BMap.ScaleControl({anchor: BMAP_ANCHOR_TOP_LEFT});
map.addControl(new BMap.NavigationControl());
map.addControl(new BMap.OverviewMapControl());
}