<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>天气</title>
<link rel="stylesheet" href="./Cesium/Widgets/widgets.css" />
<script src="./Cesium/Cesium.js"></script>
<script src="./Snow.js"></script>
<script src="./Rain.js"></script>
<script src="./Fog.js"></script>
<style>
html,
body {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
}
</style>
</head>
<body>
<div id="map">
<div style="position: absolute; top: 20px; left: 20px; z-index: 10">
<button onclick="addWeather('rain')">雨</button>
<button onclick="addWeather('snow')">雪</button>
<button onclick="addWeather('fog')">雾</button>
<button onclick="destoryWeather()">清除天气</button>
</div>
</div>
<script>
Cesium.Ion.defaultAccessToken =
"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiJlOGI2YzI4Ni1lNzhjLTRlY2UtYTkyMC1jZjkzMTU2ZmEzODgiLCJpZCI6MjU4MTAsImlhdCI6MTY3ODMyOTk4NH0.mHHrXlX2_3KhkP8i3DHCG_0ZIRCfGeCwN8nRRofCkNc";
let viewer = new Cesium.Viewer("map", {
timeline: false,
homeButton: false,
fullscreenButton: false,
baseLayerPicker: false,
infoBox: false,
animation: false,
sceneModePicker: false,
vrButton: false,
scene3DOnly: true,
geocoder: false,
navigationHelpButton: false,
selectionIndicator: false,
});
viewer.scene.debugShowFramesPerSecond = true;
viewer.camera.setView({
destination: Cesium.Cartesian3.fromDegrees(
116.180726,
39.915671,
10000
),
orientation: {
heading: Cesium.Math.toRadians(90),
pitch: Cesium.Math.toRadians(-30),
roll: 0,
},
});
let snow = null;
let rain = null;
let fog = null;
function destoryWeather() {
if (snow) {
snow.destroy();
}
if (rain) {
rain.destroy();
}
if (fog) {
fog.destroy();
}
}
function addWeather(type) {
destoryWeather();
if (type == "rain") {
rain = new Cesium.Rain(viewer, {
tiltAngle: 0.1, //倾斜角度
rainSize: 0.7, //雨大小
rainSpeed: 80, //雨速
});
} else if (type == "snow") {
snow = new Cesium.Snow(viewer, {
snowSize: 0.01, //雪大小
snowSpeed: 60.0, //雪速
});
} else {
fog = new Cesium.FogW(viewer, {
visibility: 0.3,
color: new Cesium.Color(0.8, 0.8, 0.8, 0.3),
});
}
}
</script>
</body>
</html>
cesium实现雨雪雾天气特效 （379个子文件） 
index.cjs 3.65MB widgets.css 29KB lighter.css 6KB InfoBoxDescription.css 5KB Timeline.css 3KB Animation.css 3KB CesiumInspector.css 3KB BaseLayerPicker.css 2KB Cesium3DTilesInspector.css 2KB CesiumWidget.css 2KB NavigationHelpButton.css 2KB Viewer.css 2KB shared.css 2KB InfoBox.css 2KB lighter.css 2KB Geocoder.css 2KB SceneModePicker.css 2KB ProjectionPicker.css 1KB lighter.css 1KB lighterShared.css 1KB lighter.css 734B lighter.css 495B SelectionIndicator.css 472B VoxelInspector.css 449B lighter.css 438B PerformanceWatchdog.css 371B lighter.css 307B FullscreenButton.css 193B VRButton.css 169B
info-loading.gif 723B
index.html 3KB
waterNormals.jpg 287KB StarBurst.jpg 191KB tycho2t3_80_mz.jpg 164KB tycho2t3_80_py.jpg 149KB tycho2t3_80_pz.jpg 149KB tycho2t3_80_my.jpg 149KB tycho2t3_80_px.jpg 120KB tycho2t3_80_mx.jpg 116KB DirtMask.jpg 111KB waterNormalsSmall.jpg 33KB moonSmall.jpg 18KB 2.jpg 16KB 2.jpg 16KB 2.jpg 16KB 3.jpg 15KB 1.jpg 15KB 3.jpg 15KB 0.jpg 14KB 1.jpg 13KB 1.jpg 13KB 1.jpg 13KB 3.jpg 12KB 1.jpg 12KB 1.jpg 12KB 2.jpg 12KB 0.jpg 12KB 3.jpg 12KB 3.jpg 12KB 3.jpg 12KB 2.jpg 11KB 2.jpg 11KB 1.jpg 11KB 1.jpg 11KB 2.jpg 11KB 3.jpg 11KB 0.jpg 10KB 0.jpg 10KB 0.jpg 10KB 3.jpg 10KB 1.jpg 10KB 1.jpg 10KB 0.jpg 9KB 0.jpg 9KB 1.jpg 9KB 0.jpg 9KB 0.jpg 8KB 0.jpg 8KB 2.jpg 8KB 0.jpg 8KB 0.jpg 7KB 0.jpg 7KB 1.jpg 7KB 0.jpg 6KB Cesium.js 3.6MB index.js 3.6MB google-earth-dbroot-parser.js 214KB Transforms-fce95115.js 121KB draco_decoder_nodejs.js 57KB Matrix2-413c4048.js 36KB basis_transcoder.js 33KB GeometryPipeline-e049e700.js 30KB pako_deflate.min.js 27KB createVerticesFromHeightmap.js 26KB decodeGoogleEarthEnterprisePacket.js 25KB transcodeKTX2.js 24KB Matrix3-81054f0f.js 23KB pako_inflate.min.js 21KB FrustumGeometry-9378eccf.js 19KB createGroundPolylineGeometry.js 18KB共 379 条
- 1
- 2
- 3
- 4
资源评论
