Skip to content

m-gis核心库 v0.4.4


@m-tech/gis-core

基于 Cesium 的三维 GIS 核心库(二次封装)。统一封装 Viewer、图层、覆盖物、量测/标绘、空间分析、特效材质与常用控件,面向业务系统提供一致的 API 与坐标模型。

说明
包名@m-tech/gis-core
当前版本0.4.5
底层引擎Cesium 1.140(由 monorepo 根依赖提供)
模块格式ESM (ty-gis.es.js) + UMD (ty-gis.umd.js)
类型dist/types/index.d.ts
样式dist/style.css

设计概览

Viewer (extends Cesium.Viewer)
  ├── Layer 缓存 / Effect 缓存 / Widget 缓存
  ├── MouseEvent / ViewerEvent / SceneEvent
  └── Loop (相机/层级 tick)

Overlay ──addToLayer──► Layer ──addToViewer──► Viewer
Effect  ──addToViewer──────────────────────► Viewer
Widget  ──addToViewer──────────────────────► Viewer
Analysis / Measure / Plot  ──构造时注入──► Viewer

核心约定:

  1. 坐标统一用 Positionlng / lat / alt / heading / pitch / roll(角度对外为度,内部 heading/pitch/roll 以弧度存储)。
  2. 代理对象 _delegate:封装类内部持有 Cesium 原生对象(Entity / Primitive / DataSource / PostProcessStage 等),对外通过本库 API 操作。
  3. 链式调用new X(...).addToLayer(layer) / layer.addToViewer(viewer) / setStyle(...) 等尽量返回 this
  4. 事件模型:封装 on / off / fire,基于 Cesium.Event;鼠标交互见 MouseEventType

目录结构

packages/core/
├── index.ts              # 统一导出入口
├── viewer/               # Viewer 及默认配置
├── base/                 # Position / Color / Loop
├── overlay/              # 覆盖物(Entity / Primitive / HTML)
├── layer/                # 图层(Entity、影像、地形、MVT、WKT、CZML…)
├── event/                # 事件基类与枚举
├── material/             # 动态材质(Property + GLSL,多为 JS)
├── effects/              # 后处理特效 + shader/
├── analysis/             # 空间分析(通视、可视域、淹没、填挖方…)
├── geomatics/            # 量测 Measure / 标绘 Plot / 拾取 Pick
├── widget/               # UI 控件(搜索、鹰眼、工具箱…)
├── liteUtils/            # 相机/图层/影像/实体快捷工具(单例)
├── utils/                # 坐标转换、DOM、聚类、Suggestion…
├── roaming/              # 键盘漫游
├── plugin/               # CacheDB 等插件
├── store/                # 全局 Viewer 引用(调试)
├── assets/               # 样式、图片、heatmap 等
├── superMap/             # SuperMap3D 相关静态资源
├── dist/                 # 构建产物
└── docs/                 # TypeDoc 输出

快速开始

在 monorepo 内开发

bash
# 仓库根目录
pnpm install
pnpm run core:lib          # 构建本包
pnpm run demo:serve        # 功能演示(apps/demo)
pnpm run docs:serve        # 文档站
pnpm run playground:serve  # 在线演练场

作为依赖安装(私有源)

bash
npm install @m-tech/gis-core
ts
import {
  Viewer,
  EntityLayer,
  Point,
  Position,
  MouseEventType,
} from "@m-tech/gis-core";
import "@m-tech/gis-core/dist/style.css";

const viewer = new Viewer(document.getElementById("cesiumContainer"), {
  defaultView: [118.78, 31.91, 2000, 0, -45, 0],
  navigationVisible: true,
  locationBar: true,
});

const layer = new EntityLayer({ id: "demo" }).addToViewer(viewer);
const point = new Point(new Position(118.786, 31.913, 10)).addToLayer(layer);
point.setStyle({ pixelSize: 16 });
point.on(MouseEventType.CLICK, (evt) => console.log(evt));

Viewer 常用选项

viewer/config.tsOPT / DEF_OPTS

选项默认说明
imageryProviderType天地图底图服务类型
imageryType影像注记底图样式
viewerMode3D2D / 3D
defaultView全国视角[lng, lat, alt, heading, pitch, roll]
locationBarfalse经纬度状态栏
navigationVisiblefalse罗盘/比例尺/缩放
useMapControlfalse传统地图交互(左键平移、右键旋转)
debug开发环境默认开挂载 globalThis.viewer

Cesium 原生控件默认大多关闭(animation、timeline、infoBox 等),按需在 options 中打开。


模块能力一览

Overlay(覆盖物)

分类
EntityPoint Label Billboard Marker Polyline Polygon Rectangle Ellipse Wall Box Corridor Cylinder Ellipsoid Plane PolylineVolume Heatmap
PrimitiveTileset Water Video Mask ScanCirclePrimitive
HTMLDivBoard

Layer(图层)

EntityLayer PrimitiveLayer HtmlLayer ImageryLayer TerrainLayer MvtLayer WKTLayer CzmlLayer EchartsLayer

Analysis(分析)

SightLine ViewShed SkyLine Flood Buffer Elevation ElevationTrend CutFillVolume HeightLimit

Geomatics

  • Measure:距离 / 面积 / 高度
  • Plot:点线面圆矩形等标绘
  • Pick:场景拾取

Effects / Material

  • 后处理:雾、云、雨雪、扫描等(部分仅在 effects/ 内导出,根入口可能未全部 re-export)
  • 动态材质:Material 命名空间(流动线、尾迹、波纹、墙体等)

Widget

LocationBar Search Toolbox HawkEye ImageryPicker HtmlOverlay Tooltip

工具

Position Color Transform Convertor Util DomUtil Clustering CameraUtil LayerUtil ImageryUtil EntityUtil Suggestion


构建与发布

bash
# 类型检查 + Vite 库构建(产出 dist/)
pnpm run lib                 # 在 packages/core 下
# 或 monorepo 根:
pnpm run core:lib

# TypeDoc
pnpm run typedoc:build

# 发包(私有 registry)
pnpm run pub

构建会:

  1. 打包 index.tsdist/ty-gis.es.js / ty-gis.umd.js
  2. 生成类型声明 → dist/types/
  3. 拷贝 Cesium 静态资源 → dist/cesiumStatic/
  4. 拷贝 SuperMap 资源 → dist/superMap/

相关包与应用

路径说明
packages/biz业务组件(地图/标绘/轨迹等 Vue 封装)
packages/vueVue 组件版占位
apps/demo核心能力演示
apps/docsVitePress 文档
apps/playground在线代码演练
apps/example业务最佳实践示例
apps/platform平台工具

AI 协作说明见同目录 AGENTS.md;待办与缺口见 TODO.md


许可

ISC(见 package.json

MGis 地理三维库