Cesium-Examples/examples/cesiumEx/8.1.2、海流.html
2025-06-12 14:10:21 +08:00

48 lines
1.7 KiB
HTML

<!--********************************************************************
* by jiawanlong
*********************************************************************-->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<link rel="stylesheet" href="./../../libs/cesium/Cesium1.98/Widgets/widgets.css">
<script type="text/javascript" src="./../../libs/cesium/Cesium1.98/Cesium.js"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>
<body style="margin: 0; overflow: hidden; background: #fff; width: 100%; height: 100%; position: absolute; top: 0">
<div id="map" style="margin: 0 auto; width: 100%; height: 100%"></div>
<script type="module">
Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiIyMjBhMzcxMC0wNjBiLTRmYjItYjY1MC0wMzAwMzMyMGUyMmEiLCJpZCI6MzAzNzc3LCJpYXQiOjE3NDc2Mzk0NTV9.E_90aKtVdzRGlU2z48VwJ4mWvl-uuDkfQBCOO6zbzn4'
const viewer = new Cesium.Viewer('map', {});
viewer.scene.debugShowFramesPerSecond = true;
// 加载底图
var xyz = new Cesium.UrlTemplateImageryProvider({
"url": './ocean/SeaSpeed_202307271200/{z}/{x}/{y}.png'
})
viewer.imageryLayers.addImageryProvider(xyz)
// 加载洋流
import LayerOceanCurrent from "./ocean/layers/LayerOceanCurrent/LayerOceanCurrent.js"
console.log(LayerOceanCurrent)
let seaWave = new LayerOceanCurrent({});
axios({
method: "get",
url: "./ocean/SeawaveDirection_202307251200_0200.json",
}).then((res) => {
seaWave.load(res.data.data);
seaWave.addToMap(viewer);
});
// seaWave.clean();
</script>
</body>
</html>