主题
标准版 API 概览
标准版 API (@gmap/standard) 提供完整的 ES 模块类体系,覆盖地图开发的所有方面。与简易版不同,标准版导出的是具体类,你可以 new 出任何对象,也可以继承扩展。
核心类
| 类别 | 类型数 | 说明 |
|---|---|---|
| 几何 Geometry | 15 | Point, LineString, Polygon, Circle, BoundingBox, Ellipse, 3D 类型等 |
| 符号 Symbol | 12 | Fill, Line, Marker, Text, Picture, Icon, Gradient, Model, Billboard 等 |
| 渲染器 Renderer | 8 | Simple, UniqueValue, ClassBreaks, Graduated, DotDensity, Heatmap, Mesh, Custom |
| 图层 Layer | 19+ | Tile, VectorTile, Feature, Graphics, Image, Heatmap, Terrain, 3DTiles 等 |
| 数据源 Source | 11 | RasterTile, VectorTile, GeoJSON, WMS, WMTS, Image, Terrain, 3DTiles, Stream 等 |
| 控件 Control | 19 | Zoom, ScaleBar, Overview, MousePosition, Legend, Search, ContextMenu 等 |
| 交互 Interaction | 3 | Draw, Edit, Measure |
| 弹窗/提示 | 2 | Popup, Tooltip |
| 样式 | 1 | Style (Mapbox Style Spec) |
| 投影 | 1 | Projection |
| 格式 | 6 | GeoJson, Kml, Gpx, Shp, Wkt, Csv |
| 工具命名空间 | 4 | Measurement, Analysis, GeomUtils, ProjectionUtils |
快速开始
工厂函数
ts
import { createMap } from '@gmap/standard';
const map = await createMap({
target: 'map',
engine: 'ol',
});创建几何体
ts
import { Point, LineString, Polygon, Circle } from '@gmap/standard';
const point = new Point([116.397, 39.908]);
const line = new LineString([[116.3, 39.9], [116.5, 39.9]]);
const polygon = new Polygon([[[0, 0], [1, 0], [1, 1], [0, 1], [0, 0]]]);
const circle = new Circle([116.397, 39.908], 5000);设置符号与图层
ts
import { FillSymbol, SimpleRenderer, FeatureLayer, GeoJsonSource } from '@gmap/standard';
const source = new GeoJsonSource({ id: 'my-data', data: geojsonObject });
const fill = new FillSymbol({ color: '#3388ff', opacity: 0.6 });
const renderer = new SimpleRenderer({ symbol: fill });
const layer = new FeatureLayer({ id: 'my-layer', source, renderer });
map.addLayer(layer);使用量算工具
ts
import { Measurement } from '@gmap/standard';
const dist = Measurement.distance([[0, 0], [1, 1]]);
console.log(Measurement.formatDistance(dist)); // "156.90 km"命名空间
| 命名空间 | 说明 |
|---|---|
Measurement | 量算工具:距离、面积、方位角、中点、沿线路量测等 |
Analysis | 空间分析:缓冲区、叠加、最近邻、视域、等值线等 |
GeomUtils | 几何操作:联合、交集、差集、凸包、简化、验证等 |
ProjectionUtils | 投影工具:注册、查询、坐标转换等 |
模块结构
@gmap/standard
├── factory.ts # createMap 工厂函数
├── geometry.ts # 15 种几何类型
├── symbols.ts # 12 种符号类型
├── renderers.ts # 8 种渲染器
├── layers.ts # 19+ 图层类型
├── sources.ts # 11 种数据源
├── controls.ts # 核心控件(Overview, MousePosition, Legend 等)
├── controls-extra.ts # 扩展控件(Zoom, Compass, ScaleBar 等)
├── interaction.ts # 交互类(Draw, Edit, Measure)
├── popup.ts # Popup 弹窗
├── tooltip.ts # Tooltip 提示
├── style.ts # Style 样式
├── projection.ts # Projection 投影
├── format.ts # 6 种格式解析器
├── feature-collection.ts # FeatureCollection 要素集合
└── utils.ts # Measurement, Analysis, GeomUtils, ProjectionUtils与简易版的区别
| 特性 | 简易版 | 标准版 |
|---|---|---|
| API 风格 | 函数式工厂 | 面向对象类 |
| 创建方式 | G.layer.tile(...) | new TileLayer(...) |
| 继承扩展 | 不支持 | 可以继承任何类 |
| 类型安全 | 基础 | 完整 TypeScript 类型 |
| 导出数量 | ~50 个 | ~100 个 |
| 适用场景 | 生产环境 | 生产级应用 |
相关文档
- 地图 Map — MapModel 与 createMap
- 几何 Geometry — 15 种几何类型
- 符号 Symbol — 12 种符号类型
- 渲染器 Renderer — 8 种渲染器
- 图层 Layer — 19+ 图层类型
- 数据源 Source — 11 种数据源
- 控件 Control — 19 种控件
- 交互 Interaction — Draw, Edit, Measure
- 弹窗/提示 Popup/Tooltip
- 样式 Style
- 投影 Projection
- 格式 Format
- 工具 Utils