> **本文回答**：primitive 主题总览 —— 非 Symbol 的底座图元：line / polygon / 圆弧 / GeoJSON source / SVG / DIV 覆盖物。

# Primitive 主题

Primitive 指"CAD 或业务数据的可视化底座"：**线、面、圆弧、曲线**等基础几何图元的渲染与编辑，不涉及图标符号（图标看 [symbol/](../symbol/overview.md)），也不涉及 CAD 专用实体（看 vjmapext 的 [entity/](../../../vjmapext/references/entity/overview.md)）。

## 子项索引

| 文件 | 主题 |
|---|---|
| [line](line.md) | `vjmap.Polyline` 线 / 虚线 / 渐变 / 动画 |
| [polygon-fill](polygon-fill.md) | `vjmap.Polygon` 面 / 缕空 / 图案 |
| [polyline-api](polyline-api.md) | Polyline 辅助 API（单独创建数据源+图层） |
| [circle-arc](circle-arc.md) | `CircleFill` / `EllipseFill` / 弧 / 曲线 |
| [geojson-source](geojson-source.md) | GeoJSON source 创建 / setData / 属性更新 |
| [editing](editing.md) | 交互编辑底座图形（vjmap.Draw） |
| [svg-div-overlay](svg-div-overlay.md) | SvgOverlay / DivOverlay 覆盖物 |

## 最小示例

```js
const polyline = new vjmap.Polyline({
  data: map.toLngLat(features),          // GeoJSON LineString[]
  lineColor: ["case", ["boolean", ["feature-state", "hover"], false], "#f00", ["get", "color"]],
  lineWidth: 3,
  isHoverPointer: true,
  isHoverFeatureState: true
});
polyline.addTo(map);
polyline.clickLayer(e => console.log(e.features[0].properties));
```

## 主题级 Top 3 陷阱

1. **data 必须是 LngLat**：CAD 几何一律先 `map.toLngLat(...)`。
2. **feature-state 要求 feature 有 id**：GeoJSON source `generateId: true` 或数据自带 id。
3. **SVG/DIV 覆盖物性能低**：仅小量使用；大量改用 `fill` / `line` 图层。
