1.0.6 • Published 1 year ago
@gvol-org/daassdk.cesium v1.0.6
快速上手
script 引入
html 部分
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Dass测试</title>
<link rel="shortcut icon" type="image/x-icon" href="./favicon.ico">
<meta name="viewport" content="width=device-width,initial-scale=1">
<link href="./Cesium/Widgets/widgets.css" rel="stylesheet">
<script src="./Cesium/Cesium.js"></script>
<script src="./daassdk.min.js"></script>
</head>
<body>
<div id="cesiumContainer"></div>
</body>js 部分
加载数据服务
<script>
const viewer = new Cesium.Viewer('cesiumContainer');
let instance = daassdk.useCesium(viewer);
let layer = instance.addLayer({
name: 'yingxiang',
index: 0,
baseUrl: "https://tiles.geovis.online/base/v1/img/{z}/{x}/{y}",
tmsIds: "w",
visible:true,
format:'webp',
token: "token...",
minimumLevel: 0,
maximumLevel: 18,
});
</script>加载地名样式
<script>
let style='xxxx' //style就是mapboxgl的style是矢量样式配置文件
daassdk.MapboxPlaceName(viewer, styles)
</script>通过 npm 安装
npm i cesium @gvol-org/daassdk.cesium
//入口文件
import "cesium/Source/Widgets/widgets.css";
import * as Cesium from "cesium";
//需要用到的js文件引入
import {
MapboxPlaceName,
useCesium,
CesiumInstance,
} from "@gvol-org/daassdk.cesium";
(window as any)['CESIUM_BASE_URL'] = "./node_modules/Cesium/Build/Cesium";
(window as any)['Cesium'] = Cesium
const viewer = new Cesium.Viewer("cesiumContainer");
let instance1: CesiumInstance = useCesium(viewer);
let layer: CesiumInstance = instance1.addLayer({
name: "yingxiang",
index: 0,
baseUrl: "https://tiles.geovis.online/base/v1/img/{z}/{x}/{y}",
tmsIds: "w",
visible: true,
format: "webp",
token: "token....",
minimumLevel: 0,
maximumLevel: 18,
});
layer.show=true
let style='xxxx' //style就是mapboxgl的style是矢量样式配置文件
new MapboxPlaceName(viewer, style);