Scene Mapping GIS

外观

快速开始 ​

环境要求 ​

  • Vue >= 3.3
  • 支持 ESM 的现代构建工具，推荐 Vite 5+
  • 地图容器必须具有明确宽度和高度

安装 ​

bash
npm install scene-mapping-gis

Leaflet、Leaflet Draw 和 Cesium 当前随主包安装；Vue 是 peer dependency。

引入样式 ​

在业务项目入口引入一次：

ts
import "scene-mapping-gis/dist/style.css";

最小示例 ​

vue
<template>
  <div class="map-container">
    <TMap provider="osm" @load="onLoad" @error="onError">
      <TMapMarker
        :position="{ lng: 116.4074, lat: 39.9042 }"
        title="北京"
      />
    </TMap>
  </div>
</template>

<script setup lang="ts">
import { TMap, TMapMarker } from "scene-mapping-gis/2d";
import "scene-mapping-gis/dist/style.css";

function onLoad(map: unknown) {
  console.log("地图加载完成", map);
}

function onError(error: Error) {
  console.error("地图加载失败", error);
}
</script>

<style scoped>
.map-container {
  width: 100%;
  height: 600px;
}
</style>

导入入口 ​

ts
// 推荐：仅表达 2D 依赖
import { TMap, TMapMarker } from "scene-mapping-gis/2d";

// 也可从主入口导入
import { TMap, TMapMarker } from "scene-mapping-gis";

/2d 是同一 npm 包的子路径导出，不需要安装另一份包。

下一步 ​