阐述商业网站开发岗位需求分析,汽车价格网,北京好用的h5建站,怎么注册网站挣流量CesiumJS CesiumJS API#xff1a;https://cesium.com/learn/cesiumjs/ref-doc/index.html CesiumJS 是一个开源的 JavaScript 库#xff0c;它用于在网页中创建和控制 3D 地球仪#xff08;地图#xff09; 一、添加指定长宽的图片图层#xff08;原点为图片图层的中心…CesiumJS CesiumJS APIhttps://cesium.com/learn/cesiumjs/ref-doc/index.html CesiumJS 是一个开源的 JavaScript 库它用于在网页中创建和控制 3D 地球仪地图 一、添加指定长宽的图片图层原点为图片图层的中心点
!DOCTYPE html
html langenheadmeta charsetUTF-8 /meta nameviewport contentwidthdevice-width, initial-scale1.0 /titleImageryProvider - 添加指定长宽的图片图层原点为图片图层的中心点/titlelink relstylesheet href../js/Cesium-1.112/Build/Cesium/Widgets/widgets.css /style* {margin: 0;padding: 0;box-sizing: border-box;}html,body {width: 100%;height: 100%;}.container {width: 100%;height: 100%;}/style/headbodydiv idcontainer/div/bodyscript src../js/Cesium-1.112/Build/Cesium/Cesium.js/scriptscriptconst viewer new Cesium.Viewer(container);// 图片图层的长宽const imageWidth 200; // 单位为米const imageHeight 100; // 单位为米// 图片图层的原点const originLongitude 0; // 原点经度const originLatitude 0; // 原点纬度// 在赤道上每度大约对应 111,320 米const degreesPerMeterAtEquator 111320;const longitudeRange imageWidth / degreesPerMeterAtEquator;const latitudeRange imageHeight / degreesPerMeterAtEquator;const west originLongitude - longitudeRange / 2; // 西经西经为负const south originLatitude - latitudeRange / 2; // 南纬南纬为负const east originLongitude longitudeRange / 2; // 东经东经为正const north originLatitude latitudeRange / 2; // 北纬北纬为正// 创建图片图层const imageryProvider new Cesium.SingleTileImageryProvider({url: ../img/test.jpg,rectangle: Cesium.Rectangle.fromDegrees(west, south, east, north),});viewer.imageryLayers.addImageryProvider(imageryProvider);// 添加一个点表示原点const entity viewer.entities.add({position: Cesium.Cartesian3.fromDegrees(originLongitude, originLatitude),point: {pixelSize: 5,color: new Cesium.Color(0, 1, 0, 1),},});// 调整相机视角以查看图片viewer.camera.flyTo({destination: Cesium.Cartesian3.fromDegrees(originLongitude, originLatitude, 1000.0),duration: 2.0,});/script
/html二、添加指定长宽的图片图层原点为图片图层的左上角顶点
!DOCTYPE html
html langenheadmeta charsetUTF-8 /meta nameviewport contentwidthdevice-width, initial-scale1.0 /titleImageryProvider - 添加指定长宽的图片图层原点为图片图层的左上角顶点/titlelink relstylesheet href../js/Cesium-1.112/Build/Cesium/Widgets/widgets.css /style* {margin: 0;padding: 0;box-sizing: border-box;}html,body {width: 100%;height: 100%;}.container {width: 100%;height: 100%;}/style/headbodydiv idcontainer/div/bodyscript src../js/Cesium-1.112/Build/Cesium/Cesium.js/scriptscriptconst viewer new Cesium.Viewer(container);// 图片图层的长宽const imageWidth 200; // 单位为米const imageHeight 100; // 单位为米// 图片图层的原点const originLongitude 0; // 原点经度const originLatitude 0; // 原点纬度// 在赤道上每度大约对应 111,320 米const degreesPerMeterAtEquator 111320;const longitudeRange imageWidth / degreesPerMeterAtEquator;const latitudeRange imageHeight / degreesPerMeterAtEquator;const west originLongitude; // 西经西经为负const south originLatitude - latitudeRange; // 南纬南纬为负const east originLongitude longitudeRange; // 东经东经为正const north originLatitude; // 北纬北纬为正// 创建图片图层const imageryProvider new Cesium.SingleTileImageryProvider({url: ../img/test.jpg,rectangle: Cesium.Rectangle.fromDegrees(west, south, east, north),});viewer.imageryLayers.addImageryProvider(imageryProvider);// 添加一个点表示原点const entity viewer.entities.add({position: Cesium.Cartesian3.fromDegrees(originLongitude, originLatitude),point: {pixelSize: 5,color: new Cesium.Color(0, 1, 0, 1),},});// 调整相机视角以查看图片viewer.camera.flyTo({destination: Cesium.Cartesian3.fromDegrees(originLongitude, originLatitude, 1000.0),duration: 2.0,});/script
/html三、添加指定长宽的图片图层原点为图片图层的右上角顶点
!DOCTYPE html
html langenheadmeta charsetUTF-8 /meta nameviewport contentwidthdevice-width, initial-scale1.0 /titleImageryProvider - 添加指定长宽的图片图层原点为图片图层的右上角顶点/titlelink relstylesheet href../js/Cesium-1.112/Build/Cesium/Widgets/widgets.css /style* {margin: 0;padding: 0;box-sizing: border-box;}html,body {width: 100%;height: 100%;}.container {width: 100%;height: 100%;}/style/headbodydiv idcontainer/div/bodyscript src../js/Cesium-1.112/Build/Cesium/Cesium.js/scriptscriptconst viewer new Cesium.Viewer(container);// 图片图层的长宽const imageWidth 200; // 单位为米const imageHeight 100; // 单位为米// 图片图层的原点const originLongitude 0; // 原点经度const originLatitude 0; // 原点纬度// 在赤道上每度大约对应 111,320 米const degreesPerMeterAtEquator 111320;const longitudeRange imageWidth / degreesPerMeterAtEquator;const latitudeRange imageHeight / degreesPerMeterAtEquator;const west originLongitude - longitudeRange; // 西经西经为负const south originLatitude - latitudeRange; // 南纬南纬为负const east originLongitude; // 东经东经为正const north originLatitude; // 北纬北纬为正// 创建图片图层const imageryProvider new Cesium.SingleTileImageryProvider({url: ../img/test.jpg,rectangle: Cesium.Rectangle.fromDegrees(west, south, east, north),});viewer.imageryLayers.addImageryProvider(imageryProvider);// 添加一个点表示原点const entity viewer.entities.add({position: Cesium.Cartesian3.fromDegrees(originLongitude, originLatitude),point: {pixelSize: 5,color: new Cesium.Color(0, 1, 0, 1),},});// 调整相机视角以查看图片viewer.camera.flyTo({destination: Cesium.Cartesian3.fromDegrees(originLongitude, originLatitude, 1000.0),duration: 2.0,});/script
/html四、添加指定长宽的图片图层原点为图片图层的左下角顶点
!DOCTYPE html
html langenheadmeta charsetUTF-8 /meta nameviewport contentwidthdevice-width, initial-scale1.0 /titleImageryProvider - 添加指定长宽的图片图层原点为图片图层的左下角顶点/titlelink relstylesheet href../js/Cesium-1.112/Build/Cesium/Widgets/widgets.css /style* {margin: 0;padding: 0;box-sizing: border-box;}html,body {width: 100%;height: 100%;}.container {width: 100%;height: 100%;}/style/headbodydiv idcontainer/div/bodyscript src../js/Cesium-1.112/Build/Cesium/Cesium.js/scriptscriptconst viewer new Cesium.Viewer(container);// 图片图层的长宽const imageWidth 200; // 单位为米const imageHeight 100; // 单位为米// 图片图层的原点const originLongitude 0; // 原点经度const originLatitude 0; // 原点纬度// 在赤道上每度大约对应 111,320 米const degreesPerMeterAtEquator 111320;const longitudeRange imageWidth / degreesPerMeterAtEquator;const latitudeRange imageHeight / degreesPerMeterAtEquator;const west originLongitude; // 西经西经为负const south originLatitude; // 南纬南纬为负const east originLongitude longitudeRange; // 东经东经为正const north originLatitude latitudeRange; // 北纬北纬为正// 创建图片图层const imageryProvider new Cesium.SingleTileImageryProvider({url: ../img/test.jpg,rectangle: Cesium.Rectangle.fromDegrees(west, south, east, north),});viewer.imageryLayers.addImageryProvider(imageryProvider);// 添加一个点表示原点const entity viewer.entities.add({position: Cesium.Cartesian3.fromDegrees(originLongitude, originLatitude),point: {pixelSize: 5,color: new Cesium.Color(0, 1, 0, 1),},});// 调整相机视角以查看图片viewer.camera.flyTo({destination: Cesium.Cartesian3.fromDegrees(originLongitude, originLatitude, 1000.0),duration: 2.0,});/script
/html五、添加指定长宽的图片图层原点为图片图层的右下角顶点
!DOCTYPE html
html langenheadmeta charsetUTF-8 /meta nameviewport contentwidthdevice-width, initial-scale1.0 /titleImageryProvider - 添加指定长宽的图片图层原点为图片图层的右下角顶点/titlelink relstylesheet href../js/Cesium-1.112/Build/Cesium/Widgets/widgets.css /style* {margin: 0;padding: 0;box-sizing: border-box;}html,body {width: 100%;height: 100%;}.container {width: 100%;height: 100%;}/style/headbodydiv idcontainer/div/bodyscript src../js/Cesium-1.112/Build/Cesium/Cesium.js/scriptscriptconst viewer new Cesium.Viewer(container);// 图片图层的长宽const imageWidth 200; // 单位为米const imageHeight 100; // 单位为米// 图片图层的原点const originLongitude 0; // 原点经度const originLatitude 0; // 原点纬度// 在赤道上每度大约对应 111,320 米const degreesPerMeterAtEquator 111320;const longitudeRange imageWidth / degreesPerMeterAtEquator;const latitudeRange imageHeight / degreesPerMeterAtEquator;const west originLongitude - longitudeRange; // 西经西经为负const south originLatitude; // 南纬南纬为负const east originLongitude; // 东经东经为正const north originLatitude latitudeRange; // 北纬北纬为正// 创建图片图层const imageryProvider new Cesium.SingleTileImageryProvider({url: ../img/test.jpg,rectangle: Cesium.Rectangle.fromDegrees(west, south, east, north),});viewer.imageryLayers.addImageryProvider(imageryProvider);// 添加一个点表示原点const entity viewer.entities.add({position: Cesium.Cartesian3.fromDegrees(originLongitude, originLatitude),point: {pixelSize: 5,color: new Cesium.Color(0, 1, 0, 1),},});// 调整相机视角以查看图片viewer.camera.flyTo({destination: Cesium.Cartesian3.fromDegrees(originLongitude, originLatitude, 1000.0),duration: 2.0,});/script
/html
