主题
要素工厂
要素工厂用于创建可在地图上显示的地理要素。所有要素工厂返回的对象支持 .addTo(map) 链式调用。
G.marker(options)
创建点标记要素。
ts
G.marker(options: MarkerOptions): Feature| 参数 | 类型 | 描述 |
|---|---|---|
| coord | [number, number] | 点坐标 [lng, lat](必填) |
| symbol | object | 标记符号(默认红色图钉) |
| popup | string | 弹窗内容 |
| attributes | Record<string, any> | 自定义属性 |
| draggable | boolean | 是否可拖拽 |
ts
G.marker({
coord: [116.397, 39.908],
attributes: { name: '北京', population: 21500000 },
popup: '<b>北京</b>',
}).addTo(map);G.polyline(options)
创建折线要素。
ts
G.polyline(options: PolylineOptions): Feature| 参数 | 类型 | 描述 |
|---|---|---|
| path | Coordinate[] | 坐标数组 [[lng1, lat1], [lng2, lat2], ...](必填) |
| symbol | object | 线符号(默认蓝色 2px) |
| attributes | Record<string, any> | 自定义属性 |
ts
G.polyline({
path: [[116, 39], [117, 40], [118, 41]],
symbol: G.lineSymbol({ color: '#3498db', width: 3 }),
attributes: { type: 'route' },
}).addTo(map);G.polygon(options)
创建多边形要素。
ts
G.polygon(options: PolygonOptions): Feature| 参数 | 类型 | 描述 |
|---|---|---|
| rings | Coordinate[][] | Coordinate[] | 环形坐标数组。支持嵌套环 [外环] 或扁平环 |
| symbol | object | 填充符号(默认半透明蓝色) |
| attributes | Record<string, any> | 自定义属性 |
ts
// 扁平环(自动包装为外环)
G.polygon({
rings: [[0, 0], [10, 0], [10, 10], [0, 10], [0, 0]],
attributes: { area: 'zone1' },
}).addTo(map);
// 嵌套环(外环 + 内环挖洞)
G.polygon({
rings: [
[[0, 0], [10, 0], [10, 10], [0, 10], [0, 0]], // 外环
[[2, 2], [8, 2], [8, 8], [2, 8], [2, 2]], // 内环(挖洞)
],
}).addTo(map);G.circle(options)
创建圆形要素。
ts
G.circle(options: CircleOptions): Feature| 参数 | 类型 | 描述 |
|---|---|---|
| center | [number, number] | 圆心坐标 [lng, lat](必填) |
| radius | number | 半径(单位取决于坐标系,默认为米)(必填) |
| symbol | object | 填充符号(默认半透明蓝色) |
| attributes | Record<string, any> | 自定义属性 |
ts
G.circle({
center: [116.397, 39.908],
radius: 500,
symbol: G.fillSymbol({ color: 'rgba(255,0,0,0.2)', outline: { color: '#f00' } }),
attributes: { name: '服务范围' },
}).addTo(map);G.rectangle(options)
创建矩形要素。
ts
G.rectangle(options: RectangleOptions): Feature| 参数 | 类型 | 描述 |
|---|---|---|
| extent | Extent | 范围 [minX, minY, maxX, maxY](必填) |
| symbol | object | 填充符号(默认半透明蓝色) |
| attributes | Record<string, any> | 自定义属性 |
ts
G.rectangle({
extent: [116.0, 39.0, 117.0, 40.0],
symbol: G.fillSymbol({ color: 'rgba(0,128,0,0.2)' }),
attributes: { id: 'rect1' },
}).addTo(map);G.feature(options)
创建通用要素。
ts
G.feature(options: FeatureOptions): Feature| 参数 | 类型 | 描述 |
|---|---|---|
| geometry | object | 几何对象(GeoJSON 格式或 G.geom.* 创建的对象) |
| symbol | object | 符号 |
| attributes | Record<string, any> | 自定义属性 |
ts
G.feature({
geometry: G.geom.point([116, 39]),
symbol: G.markerSymbol({ color: '#e74c3c', size: 12 }),
attributes: { tag: 'test' },
}).addTo(map);G.featureCollection(features)
创建要素集合。
ts
G.featureCollection(features?: Feature[]): FeatureCollection| 参数 | 类型 | 描述 |
|---|---|---|
| features | Feature[] | 要素数组(默认为空数组) |
ts
const fc = G.featureCollection([
G.marker({ coord: [0, 0] }),
G.marker({ coord: [1, 1] }),
]);链式调用
所有要素创建后可通过 .addTo(map) 添加到地图:
ts
G.marker({ coord: [116, 39] }).addTo(map);
G.polyline({ path: [[116, 39], [117, 40]] }).addTo(map);
G.polygon({ rings: [[0, 0], [10, 0], [10, 10], [0, 10], [0, 0]] }).addTo(map);