代码中有一点bug还没改
cesium地球
地形+地形
<html lang="en"><head><style>.cesium-animation-rectButton .cesium-animation-buttonGlow { filter: url(#animation_blurred); }.cesium-animation-rectButton .cesium-animation-buttonMain { fill: url(#animation_buttonNormal); }.cesium-animation-buttonToggled .cesium-animation-buttonMain { fill: url(#animation_buttonToggled); }.cesium-animation-rectButton:hover .cesium-animation-buttonMain { fill: url(#animation_buttonHovered); }.cesium-animation-buttonDisabled .cesium-animation-buttonMain { fill: url(#animation_buttonDisabled); }.cesium-animation-shuttleRingG .cesium-animation-shuttleRingSwoosh { fill: url(#animation_shuttleRingSwooshGradient); }.cesium-animation-shuttleRingG:hover .cesium-animation-shuttleRingSwoosh { fill: url(#animation_shuttleRingSwooshHovered); }.cesium-animation-shuttleRingPointer { fill: url(#animation_shuttleRingPointerGradient); }.cesium-animation-shuttleRingPausePointer { fill: url(#animation_shuttleRingPointerPaused); }.cesium-animation-knobOuter { fill: url(#animation_knobOuter); }.cesium-animation-knobInner { fill: url(#animation_knobInner); }</style><style>.cesium-credit-lightbox-overlay {display: none; z-index: 1; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(80, 80, 80, 0.8); }
.cesium-credit-lightbox {background-color: #303336; color: #ffffff; position: relative; min-height: 100px; margin: auto; }
.cesium-credit-lightbox > ul > li a, .cesium-credit-lightbox > ul > li a:visited {color: #ffffff; }
.cesium-credit-lightbox > ul > li a:hover {color: #48b; }
.cesium-credit-lightbox.cesium-credit-lightbox-expanded {border: 1px solid #444; border-radius: 5px; max-width: 370px; }
.cesium-credit-lightbox.cesium-credit-lightbox-mobile {height: 100%; width: 100%; }
.cesium-credit-lightbox-title {padding: 20px 20px 0 20px; }
.cesium-credit-lightbox-close {font-size: 18pt; cursor: pointer; position: absolute; top: 0; right: 6px; color: #ffffff; }
.cesium-credit-lightbox-close:hover {color: #48b; }
.cesium-credit-lightbox > ul {margin: 0; padding: 12px 20px 12px 40px; font-size: 13px; }
.cesium-credit-lightbox > ul > li {padding-bottom: 6px; }
.cesium-credit-lightbox > ul > li * {padding: 0; margin: 0; }
.cesium-credit-expand-link {padding-left: 5px; cursor: pointer; text-decoration: underline; color: #ffffff; }
.cesium-credit-expand-link:hover {color: #48b; }
.cesium-credit-text {color: #ffffff; }
.cesium-credit-textContainer *, .cesium-credit-logoContainer * {display: inline; }
</style>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Cesium Example</title>
<script src="https://cesium.com/downloads/cesiumjs/releases/1.87/Build/Cesium/Cesium.js"></script>
<link rel="stylesheet" type="text/css" href="./bucket.css">
<link rel="stylesheet" type="text/css" href="./fieldset.css">
<style>
html, body, #cesiumContainer {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow: hidden;
}
</style>
</head>
<body>
<div id="cesiumContainer"><div class="cesium-viewer"><div class="cesium-viewer-cesiumWidgetContainer"><div class="cesium-widget"><canvas width="442" height="785" style="image-rendering: pixelated;"></canvas><div class="cesium-credit-lightbox-overlay"><div class="cesium-credit-lightbox"><div class="cesium-credit-lightbox-title">Data provided by:</div><a class="cesium-credit-lightbox-close">×</a><ul></ul></div></div><div class="cesium-performanceDisplay-defaultContainer"><div class="cesium-performanceDisplay"><div class="cesium-performanceDisplay-ms">16.58 MS</div><div class="cesium-performanceDisplay-fps">59 FPS</div><div class="cesium-performanceDisplay-throttled"></div></div></div></div></div><div class="cesium-viewer-bottom" style="left: 111px; bottom: 30px;"><div class="cesium-widget-credits"><div class="cesium-credit-logoContainer" style="display: inline;"><div style="display: inline;"><a href="https://cesium.com/" target="_blank"><img title="Cesium ion" src="https://cesium.com/downloads/cesiumjs/releases/1.87/Build/Cesium/Assets/Images/ion-credit.png"></a></div></div><div class="cesium-credit-textContainer" style="display: inline;"><div style="display: inline;"><b> This application is using Cesium's default ion access token. Please assign <i>Cesium.Ion.defaultAccessToken</i> with an access token from your ion account before making any Cesium API calls. You can sign up for a free ion account at <a href="https://cesium.com" target="_blank">https://cesium.com</a>.</b></div></div><a class="cesium-credit-expand-link" style="display: none;">Data attribution</a></div></div><div class="cesium-viewer-selectionIndicatorContainer"><div class="cesium-selection-wrapper" data-bind="style: { "top" : _screenPositionY, "left" : _screenPositionX },css: { "cesium-selection-wrapper-visible" : isVisible }" style="top: -1000px; left: -1000px;"><svg:svg width="160" height="160" viewBox="0 0 160 160"><g transform="translate(80,80)"><path data-bind="attr: { transform: _transform }" d="M -34 -34 L -34 -11.25 L -30 -15.25 L -30 -30 L -15.25 -30 L -11.25 -34 L -34 -34 z M 11.25 -34 L 15.25 -30 L 30 -30 L 30 -15.25 L 34 -11.25 L 34 -34 L 11.25 -34 z M -34 11.25 L -34 34 L -11.25 34 L -15.25 30 L -30 30 L -30 15.25 L -34 11.25 z M 34 11.25 L 30 15.25 L 30 30 L 15.25 30 L 11.25 34 L 34 34 L 34 11.25 z" transform="scale(1)"></path></g></svg:svg></div></div><div class="cesium-viewer-infoBoxContainer"><div class="cesium-infoBox cesium-infoBox-bodyless" data-bind="css: { "cesium-infoBox-visible" : showInfo, "cesium-infoBox-bodyless" : _bodyless }"><div class="cesium-infoBox-title" data-bind="text: titleText"></div><button type="button" class="cesium-button cesium-infoBox-camera" data-bind="attr: { title: "Focus camera on object" },click: function () { cameraClicked.raiseEvent(this); },enable: enableCamera,cesiumSvgPath: { path: cameraIconPath, width: 32, height: 32 }" title="Focus camera on object" disabled=""><svg:svg class="cesium-svgPath-svg" width="32" height="32" viewBox="0 0 32 32"><path d="M 27.34375 1.65625 L 5.28125 27.9375 L 8.09375 30.3125 L 30.15625 4.03125 L 27.34375 1.65625 z M 13.84375 7.03125 C 11.412798 7.03125 9.46875 8.975298 9.46875 11.40625 L 9.46875 11.59375 L 2.53125 7.21875 L 2.53125 24.0625 L 9.46875 19.6875 C 9.4724893 20.232036 9.5676108 20.7379 9.75 21.21875 L 21.65625 7.03125 L 13.84375 7.03125 z M 28.21875 7.71875 L 14.53125 24.0625 L 25.875 24.0625 C 28.305952 24.0625 30.28125 22.087202 30.28125 19.65625 L 30.28125 11.40625 C 30.28125 9.8371439 29.456025 8.4902779 28.21875 7.71875 z"></path></svg:svg></button><button type="button" class="cesium-infoBox-close" data-bind="click: function () { closeClicked.raiseEvent(this); }">×</button><iframe class="cesium-infoBox-iframe" sandbox="allow-same-origin allow-popups allow-forms" data-bind="style : { maxHeight : maxHeightOffset(40) }" allowfullscreen="true" src="about:blank" style="max-height: 620px; height: 0px;"></iframe></div></div><div class="cesium-viewer-toolbar"><div class="cesium-viewer-geocoderContainer"><form data-bind="submit: search"><input type="search" class="cesium-geocoder-input" placeholder="Enter an address or landmark..." data-bind="textInput: searchText,disable: isSearchInProgress,event: { keyup: handleKeyUp, keydown: handleKeyDown, mouseover: deselectSuggestion },css: { "cesium-geocoder-input-wide" : keepExpanded || searchText.length > 0 },hasFocus: _focusTextbox"><span class="cesium-geocoder-searchButton" data-bind="click: search,cesiumSvgPath: { path: isSearchInProgress ? _stopSearchPath : _startSearchPath, width: 32, height: 32 }"><svg:svg class="cesium-svgPath-svg" width="32" height="32" viewBox="0 0 32 32"><path d="M29.772,26.433l-7.126-7.126c0.96-1.583,1.523-3.435,1.524-5.421C24.169,8.093,19.478,3.401,13.688,3.399C7.897,3.401,3.204,8.093,3.204,13.885c0,5.789,4.693,10.481,10.484,10.481c1.987,0,3.839-0.563,5.422-1.523l7.128,7.127L29.772,26.433zM7.203,13.885c0.006-3.582,2.903-6.478,6.484-6.486c3.579,0.008,6.478,2.904,6.484,6.486c-0.007,3.58-2.905,6.476-6.484,6.484C10.106,20.361,7.209,17.465,7.203,13.885z"></path></svg:svg></span></form><div class="search-results" data-bind="visible: _suggestionsVisible" style="display: none; max-height: 660px;"><ul data-bind="foreach: _suggestions"></ul></div></div><button type="button" class="cesium-button cesium-toolbar-button cesium-home-button" data-bind="attr: { title: tooltip },click: command,cesiumSvgPath: { path: _svgPath, width: 28, height: 28 }" title="View Home"><svg:svg class="cesium-svgPath-svg" width="28" height="28" viewBox="0 0 28 28"><path d="M14,4l-10,8.75h20l-4.25-3.7188v-4.6562h-2.812v2.1875l-2.938-2.5625zm-7.0938,9.906v10.094h14.094v-10.094h-14.094zm2.1876,2.313h3.3122v4.25h-3.3122v-4.25zm5.8442,1.281h3.406v6.438h-3.406v-6.438z"></path></svg:svg></button><span class="cesium-sceneModePicker-wrapper cesium-toolbar-button"><button type="button" class="cesium-button cesium-toolbar-button cesium-sceneModePicker-button3D" data-bind="css: { "cesium-sceneModePicker-button2D": sceneMode === _sceneMode.SCENE2D, "cesium-sceneModePicker-button3D": sceneMode === _sceneMode.SCENE3D, "cesium-sceneModePicker-buttonColumbusView": sceneMode === _sceneMode.COLUMBUS_VIEW, "cesium-sceneModePicker-selected": dropDownVisible },attr: { title: selectedTooltip },click: toggleDropDown" title="3D"><!-- ko cesiumSvgPath: { path: _globePath, width: 64, height: 64, css: "cesium-sceneModePicker-slide-svg cesium-sceneModePicker-icon3D" } --><svg:svg class="cesium-svgPath-svg cesium-sceneModePicker-slide-svg cesium-sceneModePicker-icon3D" width="64" height="64" viewBox="0 0 64 64"><path d="m 32.401392,4.9330437 c -7.087603,0 -14.096095,2.884602 -19.10793,7.8946843 -5.0118352,5.010083 -7.9296167,11.987468 -7.9296167,19.072999 0,7.085531 2.9177815,14.097848 7.9296167,19.107931 4.837653,4.835961 11.541408,7.631372 18.374354,7.82482 0.05712,0.01231 0.454119,0.139729 0.454119,0.139729 l 0.03493,-0.104797 c 0.08246,7.84e-4 0.162033,0.03493 0.244525,0.03493 0.08304,0 0.161515,-0.03414 0.244526,-0.03493 l 0.03493,0.104797 c 0,0 0.309474,-0.129487 0.349323,-0.139729 6.867765,-0.168094 13.582903,-2.965206 18.444218,-7.82482 2.558195,-2.5573 4.551081,-5.638134 5.903547,-8.977584 1.297191,-3.202966 2.02607,-6.661489 2.02607,-10.130347 0,-6.237309 -2.366261,-12.31219 -6.322734,-17.116794 -0.0034,-0.02316 0.0049,-0.04488 0,-0.06986 -0.01733,-0.08745 -0.104529,-0.278855 -0.104797,-0.279458 -5.31e-4,-0.0012 -0.522988,-0.628147 -0.523984,-0.62878 -3.47e-4,-2.2e-4 -0.133444,-0.03532 -0.244525,-0.06987 C 51.944299,13.447603 51.751076,13.104317 51.474391,12.827728 46.462556,7.8176457 39.488996,4.9330437 32.401392,4.9330437 z m -2.130866,3.5281554 0.104797,9.6762289 c -4.111695,-0.08361 -7.109829,-0.423664 -9.257041,-0.943171 1.198093,-2.269271 2.524531,-4.124404 3.91241,-5.414496 2.167498,-2.0147811 3.950145,-2.8540169 5.239834,-3.3185619 z m 2.794579,0 c 1.280302,0.4754953 3.022186,1.3285948 5.065173,3.2486979 1.424667,1.338973 2.788862,3.303645 3.982275,5.728886 -2.29082,0.403367 -5.381258,0.621049 -8.942651,0.698645 L 33.065105,8.4611991 z m 5.728886,0.2445256 c 4.004072,1.1230822 7.793098,3.1481363 10.724195,6.0782083 0.03468,0.03466 0.07033,0.06991 0.104797,0.104797 -0.45375,0.313891 -0.923054,0.663002 -1.956205,1.082899 -0.647388,0.263114 -1.906242,0.477396 -2.829511,0.733577 -1.382296,-2.988132 -3.027146,-5.368585 -4.785716,-7.0213781 -0.422866,-0.397432 -0.835818,-0.6453247 -1.25756,-0.9781032 z m -15.33525,0.7685092 c -0.106753,0.09503 -0.207753,0.145402 -0.31439,0.244526 -1.684973,1.5662541 -3.298068,3.8232211 -4.680919,6.5672591 -0.343797,-0.14942 -1.035052,-0.273198 -1.292493,-0.419186 -0.956528,-0.542427 -1.362964,-1.022024 -1.537018,-1.292493 -0.0241,-0.03745 -0.01868,-0.0401 -0.03493,-0.06986 2.250095,-2.163342 4.948824,-3.869984 7.859752,-5.0302421 z m -9.641296,7.0912431 c 0.464973,0.571618 0.937729,1.169056 1.956205,1.746612 0.349907,0.198425 1.107143,0.335404 1.537018,0.523983 -1.20166,3.172984 -1.998037,7.051901 -2.165798,11.772162 C 14.256557,30.361384 12.934823,30.161483 12.280427,29.90959 10.644437,29.279855 9.6888882,28.674891 9.1714586,28.267775 8.6540289,27.860658 8.6474751,27.778724 8.6474751,27.778724 l -0.069864,0.03493 C 9.3100294,23.691285 11.163248,19.798527 13.817445,16.565477 z m 37.552149,0.523984 c 2.548924,3.289983 4.265057,7.202594 4.890513,11.318043 -0.650428,0.410896 -1.756876,1.001936 -3.563088,1.606882 -1.171552,0.392383 -3.163859,0.759153 -4.960377,1.117832 -0.04367,-4.752703 -0.784809,-8.591423 -1.88634,-11.807094 0.917574,-0.263678 2.170552,-0.486495 2.864443,-0.76851 1.274693,-0.518066 2.003942,-1.001558 2.654849,-1.467153 z m -31.439008,2.619917 c 2.487341,0.672766 5.775813,1.137775 10.479669,1.222628 l 0.104797,10.689263 0,0.03493 0,0.733577 c -5.435005,-0.09059 -9.512219,-0.519044 -12.610536,-1.117831 0.106127,-4.776683 0.879334,-8.55791 2.02607,-11.562569 z m 23.264866,0.31439 c 1.073459,3.067541 1.833795,6.821314 1.816476,11.702298 -3.054474,0.423245 -7.062018,0.648559 -11.702298,0.698644 l 0,-0.838373 -0.104796,-10.654331 c 4.082416,-0.0864 7.404468,-0.403886 9.990618,-0.908238 z M 8.2632205,30.922625 c 0.7558676,0.510548 1.5529563,1.013339 3.0041715,1.57195 0.937518,0.360875 2.612202,0.647642 3.91241,0.978102 0.112814,3.85566 0.703989,7.107756 1.606883,9.920754 -1.147172,-0.324262 -2.644553,-0.640648 -3.423359,-0.978102 -1.516688,-0.657177 -2.386627,-1.287332 -2.864443,-1.71168 -0.477816,-0.424347 -0.489051,-0.489051 -0.489051,-0.489051 L 9.8002387,40.319395 C 8.791691,37.621767 8.1584238,34.769583 8.1584238,31.900727 c 0,-0.330153 0.090589,-0.648169 0.1047967,-0.978102 z m 48.2763445,0.419186 c 0.0047,0.188973 0.06986,0.36991 0.06986,0.558916 0,2.938869 -0.620228,5.873558 -1.676747,8.628261 -0.07435,0.07583 -0.06552,0.07411 -0.454119,0.349323 -0.606965,0.429857 -1.631665,1.042044 -3.318562,1.676747 -1.208528,0.454713 -3.204964,0.850894 -5.135038,1.25756 0.84593,-2.765726 1.41808,-6.005357 1.606883,-9.815957 2.232369,-0.413371 4.483758,-0.840201 5.938479,-1.327425 1.410632,-0.472457 2.153108,-0.89469 2.96924,-1.327425 z m -38.530252,2.864443 c 3.208141,0.56697 7.372279,0.898588 12.575603,0.978103 l 0.174662,9.885821 c -4.392517,-0.06139 -8.106722,-0.320566 -10.863925,-0.803441 -1.051954,-2.664695 -1.692909,-6.043794 -1.88634,-10.060483 z m 26.793022,0.31439 c -0.246298,3.923551 -0.877762,7.263679 -1.816476,9.885822 -2.561957,0.361954 -5.766249,0.560708 -9.431703,0.62878 l -0.174661,-9.815957 c 4.491734,-0.04969 8.334769,-0.293032 11.42284,-0.698645 z M 12.035901,44.860585 c 0.09977,0.04523 0.105535,0.09465 0.209594,0.139729 1.337656,0.579602 3.441099,1.058072 5.589157,1.537018 1.545042,3.399208 3.548524,5.969402 5.589157,7.789888 -3.034411,-1.215537 -5.871615,-3.007978 -8.174142,-5.309699 -1.245911,-1.245475 -2.271794,-2.662961 -3.213766,-4.156936 z m 40.69605,0 c -0.941972,1.493975 -1.967855,2.911461 -3.213765,4.156936 -2.74253,2.741571 -6.244106,4.696717 -9.955686,5.868615 0.261347,-0.241079 0.507495,-0.394491 0.768509,-0.663713 1.674841,-1.727516 3.320792,-4.181056 4.645987,-7.265904 2.962447,-0.503021 5.408965,-1.122293 7.161107,-1.781544 0.284034,-0.106865 0.337297,-0.207323 0.593848,-0.31439 z m -31.404076,2.305527 c 2.645807,0.376448 5.701178,0.649995 9.466635,0.698645 l 0.139729,7.789888 c -1.38739,-0.480844 -3.316218,-1.29837 -5.659022,-3.388427 -1.388822,-1.238993 -2.743668,-3.0113 -3.947342,-5.100106 z m 20.365491,0.104797 c -1.04872,2.041937 -2.174337,3.779068 -3.353494,4.995309 -1.853177,1.911459 -3.425515,2.82679 -4.611055,3.353494 l -0.139729,-7.789887 c 3.13091,-0.05714 5.728238,-0.278725 8.104278,-0.558916 z"></path></svg:svg><!-- /ko --><!-- ko cesiumSvgPath: { path: _flatMapPath, width: 64, height: 64, css: "cesium-sceneModePicker-slide-svg cesium-sceneModePicker-icon2D" } --><svg:svg class="cesium-svgPath-svg cesium-sceneModePicker-slide-svg cesium-sceneModePicker-icon2D" width="64" height="64" viewBox="0 0 64 64"><path d="m 2.9825053,17.550598 0,1.368113 0,26.267766 0,1.368113 1.36811,0 54.9981397,0 1.36811,0 0,-1.368113 0,-26.267766 0,-1.368113 -1.36811,0 -54.9981397,0 -1.36811,0 z m 2.73623,2.736226 10.3292497,0 0,10.466063 -10.3292497,0 0,-10.466063 z m 13.0654697,0 11.69737,0 0,10.466063 -11.69737,0 0,-10.466063 z m 14.43359,0 11.69737,0 0,10.466063 -11.69737,0 0,-10.466063 z m 14.43359,0 10.32926,0 0,10.466063 -10.32926,0 0,-10.466063 z m -41.9326497,13.202288 10.3292497,0 0,10.329252 -10.3292497,0 0,-10.329252 z m 13.0654697,0 11.69737,0 0,10.329252 -11.69737,0 0,-10.329252 z m 14.43359,0 11.69737,0 0,10.329252 -11.69737,0 0,-10.329252 z m 14.43359,0 10.32926,0 0,10.329252 -10.32926,0 0,-10.329252 z"></path></svg:svg><!-- /ko --><!-- ko cesiumSvgPath: { path: _columbusViewPath, width: 64, height: 64, css: "cesium-sceneModePicker-slide-svg cesium-sceneModePicker-iconColumbusView" } --><svg:svg class="cesium-svgPath-svg cesium-sceneModePicker-slide-svg cesium-sceneModePicker-iconColumbusView" width="64" height="64" viewBox="0 0 64 64"><path d="m 14.723969,17.675598 -0.340489,0.817175 -11.1680536,26.183638 -0.817175,1.872692 2.076986,0 54.7506996,0 2.07698,0 -0.81717,-1.872692 -11.16805,-26.183638 -0.34049,-0.817175 -0.91933,0 -32.414586,0 -0.919322,0 z m 1.838643,2.723916 6.196908,0 -2.928209,10.418977 -7.729111,0 4.460412,-10.418977 z m 9.02297,0 4.903049,0 0,10.418977 -7.831258,0 2.928209,-10.418977 z m 7.626964,0 5.584031,0 2.62176,10.418977 -8.205791,0 0,-10.418977 z m 8.410081,0 5.51593,0 4.46042,10.418977 -7.38863,0 -2.58772,-10.418977 z m -30.678091,13.142892 8.103649,0 -2.89416,10.282782 -9.6018026,0 4.3923136,-10.282782 z m 10.929711,0 8.614384,0 0,10.282782 -11.508544,0 2.89416,-10.282782 z m 11.338299,0 8.852721,0 2.58772,10.282782 -11.440441,0 0,-10.282782 z m 11.678781,0 7.86531,0 4.39231,10.282782 -9.6699,0 -2.58772,-10.282782 z"></path></svg:svg><!-- /ko --></button><button type="button" class="cesium-button cesium-toolbar-button cesium-sceneModePicker-dropDown-icon cesium-sceneModePicker-visible cesium-sceneModePicker-none cesium-sceneModePicker-hidden" data-bind="css: { "cesium-sceneModePicker-visible" : (dropDownVisible && (sceneMode !== _sceneMode.SCENE3D)) || (!dropDownVisible && (sceneMode === _sceneMode.SCENE3D)), "cesium-sceneModePicker-none" : sceneMode === _sceneMode.SCENE3D, "cesium-sceneModePicker-hidden" : !dropDownVisible },attr: { title: tooltip3D },click: morphTo3D,cesiumSvgPath: { path: _globePath, width: 64, height: 64 }" title="3D"><svg:svg class="cesium-svgPath-svg" width="64" height="64" viewBox="0 0 64 64"><path d="m 32.401392,4.9330437 c -7.087603,0 -14.096095,2.884602 -19.10793,7.8946843 -5.0118352,5.010083 -7.9296167,11.987468 -7.9296167,19.072999 0,7.085531 2.9177815,14.097848 7.9296167,19.107931 4.837653,4.835961 11.541408,7.631372 18.374354,7.82482 0.05712,0.01231 0.454119,0.139729 0.454119,0.139729 l 0.03493,-0.104797 c 0.08246,7.84e-4 0.162033,0.03493 0.244525,0.03493 0.08304,0 0.161515,-0.03414 0.244526,-0.03493 l 0.03493,0.104797 c 0,0 0.309474,-0.129487 0.349323,-0.139729 6.867765,-0.168094 13.582903,-2.965206 18.444218,-7.82482 2.558195,-2.5573 4.551081,-5.638134 5.903547,-8.977584 1.297191,-3.202966 2.02607,-6.661489 2.02607,-10.130347 0,-6.237309 -2.366261,-12.31219 -6.322734,-17.116794 -0.0034,-0.02316 0.0049,-0.04488 0,-0.06986 -0.01733,-0.08745 -0.104529,-0.278855 -0.104797,-0.279458 -5.31e-4,-0.0012 -0.522988,-0.628147 -0.523984,-0.62878 -3.47e-4,-2.2e-4 -0.133444,-0.03532 -0.244525,-0.06987 C 51.944299,13.447603 51.751076,13.104317 51.474391,12.827728 46.462556,7.8176457 39.488996,4.9330437 32.401392,4.9330437 z m -2.130866,3.5281554 0.104797,9.6762289 c -4.111695,-0.08361 -7.109829,-0.423664 -9.257041,-0.943171 1.198093,-2.269271 2.524531,-4.124404 3.91241,-5.414496 2.167498,-2.0147811 3.950145,-2.8540169 5.239834,-3.3185619 z m 2.794579,0 c 1.280302,0.4754953 3.022186,1.3285948 5.065173,3.2486979 1.424667,1.338973 2.788862,3.303645 3.982275,5.728886 -2.29082,0.403367 -5.381258,0.621049 -8.942651,0.698645 L 33.065105,8.4611991 z m 5.728886,0.2445256 c 4.004072,1.1230822 7.793098,3.1481363 10.724195,6.0782083 0.03468,0.03466 0.07033,0.06991 0.104797,0.104797 -0.45375,0.313891 -0.923054,0.663002 -1.956205,1.082899 -0.647388,0.263114 -1.906242,0.477396 -2.829511,0.733577 -1.382296,-2.988132 -3.027146,-5.368585 -4.785716,-7.0213781 -0.422866,-0.397432 -0.835818,-0.6453247 -1.25756,-0.9781032 z m -15.33525,0.7685092 c -0.106753,0.09503 -0.207753,0.145402 -0.31439,0.244526 -1.684973,1.5662541 -3.298068,3.8232211 -4.680919,6.5672591 -0.343797,-0.14942 -1.035052,-0.273198 -1.292493,-0.419186 -0.956528,-0.542427 -1.362964,-1.022024 -1.537018,-1.292493 -0.0241,-0.03745 -0.01868,-0.0401 -0.03493,-0.06986 2.250095,-2.163342 4.948824,-3.869984 7.859752,-5.0302421 z m -9.641296,7.0912431 c 0.464973,0.571618 0.937729,1.169056 1.956205,1.746612 0.349907,0.198425 1.107143,0.335404 1.537018,0.523983 -1.20166,3.172984 -1.998037,7.051901 -2.165798,11.772162 C 14.256557,30.361384 12.934823,30.161483 12.280427,29.90959 10.644437,29.279855 9.6888882,28.674891 9.1714586,28.267775 8.6540289,27.860658 8.6474751,27.778724 8.6474751,27.778724 l -0.069864,0.03493 C 9.3100294,23.691285 11.163248,19.798527 13.817445,16.565477 z m 37.552149,0.523984 c 2.548924,3.289983 4.265057,7.202594 4.890513,11.318043 -0.650428,0.410896 -1.756876,1.001936 -3.563088,1.606882 -1.171552,0.392383 -3.163859,0.759153 -4.960377,1.117832 -0.04367,-4.752703 -0.784809,-8.591423 -1.88634,-11.807094 0.917574,-0.263678 2.170552,-0.486495 2.864443,-0.76851 1.274693,-0.518066 2.003942,-1.001558 2.654849,-1.467153 z m -31.439008,2.619917 c 2.487341,0.672766 5.775813,1.137775 10.479669,1.222628 l 0.104797,10.689263 0,0.03493 0,0.733577 c -5.435005,-0.09059 -9.512219,-0.519044 -12.610536,-1.117831 0.106127,-4.776683 0.879334,-8.55791 2.02607,-11.562569 z m 23.264866,0.31439 c 1.073459,3.067541 1.833795,6.821314 1.816476,11.702298 -3.054474,0.423245 -7.062018,0.648559 -11.702298,0.698644 l 0,-0.838373 -0.104796,-10.654331 c 4.082416,-0.0864 7.404468,-0.403886 9.990618,-0.908238 z M 8.2632205,30.922625 c 0.7558676,0.510548 1.5529563,1.013339 3.0041715,1.57195 0.937518,0.360875 2.612202,0.647642 3.91241,0.978102 0.112814,3.85566 0.703989,7.107756 1.606883,9.920754 -1.147172,-0.324262 -2.644553,-0.640648 -3.423359,-0.978102 -1.516688,-0.657177 -2.386627,-1.287332 -2.864443,-1.71168 -0.477816,-0.424347 -0.489051,-0.489051 -0.489051,-0.489051 L 9.8002387,40.319395 C 8.791691,37.621767 8.1584238,34.769583 8.1584238,31.900727 c 0,-0.330153 0.090589,-0.648169 0.1047967,-0.978102 z m 48.2763445,0.419186 c 0.0047,0.188973 0.06986,0.36991 0.06986,0.558916 0,2.938869 -0.620228,5.873558 -1.676747,8.628261 -0.07435,0.07583 -0.06552,0.07411 -0.454119,0.349323 -0.606965,0.429857 -1.631665,1.042044 -3.318562,1.676747 -1.208528,0.454713 -3.204964,0.850894 -5.135038,1.25756 0.84593,-2.765726 1.41808,-6.005357 1.606883,-9.815957 2.232369,-0.413371 4.483758,-0.840201 5.938479,-1.327425 1.410632,-0.472457 2.153108,-0.89469 2.96924,-1.327425 z m -38.530252,2.864443 c 3.208141,0.56697 7.372279,0.898588 12.575603,0.978103 l 0.174662,9.885821 c -4.392517,-0.06139 -8.106722,-0.320566 -10.863925,-0.803441 -1.051954,-2.664695 -1.692909,-6.043794 -1.88634,-10.060483 z m 26.793022,0.31439 c -0.246298,3.923551 -0.877762,7.263679 -1.816476,9.885822 -2.561957,0.361954 -5.766249,0.560708 -9.431703,0.62878 l -0.174661,-9.815957 c 4.491734,-0.04969 8.334769,-0.293032 11.42284,-0.698645 z M 12.035901,44.860585 c 0.09977,0.04523 0.105535,0.09465 0.209594,0.139729 1.337656,0.579602 3.441099,1.058072 5.589157,1.537018 1.545042,3.399208 3.548524,5.969402 5.589157,7.789888 -3.034411,-1.215537 -5.871615,-3.007978 -8.174142,-5.309699 -1.245911,-1.245475 -2.271794,-2.662961 -3.213766,-4.156936 z m 40.69605,0 c -0.941972,1.493975 -1.967855,2.911461 -3.213765,4.156936 -2.74253,2.741571 -6.244106,4.696717 -9.955686,5.868615 0.261347,-0.241079 0.507495,-0.394491 0.768509,-0.663713 1.674841,-1.727516 3.320792,-4.181056 4.645987,-7.265904 2.962447,-0.503021 5.408965,-1.122293 7.161107,-1.781544 0.284034,-0.106865 0.337297,-0.207323 0.593848,-0.31439 z m -31.404076,2.305527 c 2.645807,0.376448 5.701178,0.649995 9.466635,0.698645 l 0.139729,7.789888 c -1.38739,-0.480844 -3.316218,-1.29837 -5.659022,-3.388427 -1.388822,-1.238993 -2.743668,-3.0113 -3.947342,-5.100106 z m 20.365491,0.104797 c -1.04872,2.041937 -2.174337,3.779068 -3.353494,4.995309 -1.853177,1.911459 -3.425515,2.82679 -4.611055,3.353494 l -0.139729,-7.789887 c 3.13091,-0.05714 5.728238,-0.278725 8.104278,-0.558916 z"></path></svg:svg></button><button type="button" class="cesium-button cesium-toolbar-button cesium-sceneModePicker-dropDown-icon cesium-sceneModePicker-hidden" data-bind="css: { "cesium-sceneModePicker-visible" : (dropDownVisible && (sceneMode !== _sceneMode.SCENE2D)), "cesium-sceneModePicker-none" : sceneMode === _sceneMode.SCENE2D, "cesium-sceneModePicker-hidden" : !dropDownVisible },attr: { title: tooltip2D },click: morphTo2D,cesiumSvgPath: { path: _flatMapPath, width: 64, height: 64 }" title="2D"><svg:svg class="cesium-svgPath-svg" width="64" height="64" viewBox="0 0 64 64"><path d="m 2.9825053,17.550598 0,1.368113 0,26.267766 0,1.368113 1.36811,0 54.9981397,0 1.36811,0 0,-1.368113 0,-26.267766 0,-1.368113 -1.36811,0 -54.9981397,0 -1.36811,0 z m 2.73623,2.736226 10.3292497,0 0,10.466063 -10.3292497,0 0,-10.466063 z m 13.0654697,0 11.69737,0 0,10.466063 -11.69737,0 0,-10.466063 z m 14.43359,0 11.69737,0 0,10.466063 -11.69737,0 0,-10.466063 z m 14.43359,0 10.32926,0 0,10.466063 -10.32926,0 0,-10.466063 z m -41.9326497,13.202288 10.3292497,0 0,10.329252 -10.3292497,0 0,-10.329252 z m 13.0654697,0 11.69737,0 0,10.329252 -11.69737,0 0,-10.329252 z m 14.43359,0 11.69737,0 0,10.329252 -11.69737,0 0,-10.329252 z m 14.43359,0 10.32926,0 0,10.329252 -10.32926,0 0,-10.329252 z"></path></svg:svg></button><button type="button" class="cesium-button cesium-toolbar-button cesium-sceneModePicker-dropDown-icon cesium-sceneModePicker-hidden" data-bind="css: { "cesium-sceneModePicker-visible" : (dropDownVisible && (sceneMode !== _sceneMode.COLUMBUS_VIEW)) || (!dropDownVisible && (sceneMode === _sceneMode.COLUMBUS_VIEW)), "cesium-sceneModePicker-none" : sceneMode === _sceneMode.COLUMBUS_VIEW, "cesium-sceneModePicker-hidden" : !dropDownVisible},attr: { title: tooltipColumbusView },click: morphToColumbusView,cesiumSvgPath: { path: _columbusViewPath, width: 64, height: 64 }" title="Columbus View"><svg:svg class="cesium-svgPath-svg" width="64" height="64" viewBox="0 0 64 64"><path d="m 14.723969,17.675598 -0.340489,0.817175 -11.1680536,26.183638 -0.817175,1.872692 2.076986,0 54.7506996,0 2.07698,0 -0.81717,-1.872692 -11.16805,-26.183638 -0.34049,-0.817175 -0.91933,0 -32.414586,0 -0.919322,0 z m 1.838643,2.723916 6.196908,0 -2.928209,10.418977 -7.729111,0 4.460412,-10.418977 z m 9.02297,0 4.903049,0 0,10.418977 -7.831258,0 2.928209,-10.418977 z m 7.626964,0 5.584031,0 2.62176,10.418977 -8.205791,0 0,-10.418977 z m 8.410081,0 5.51593,0 4.46042,10.418977 -7.38863,0 -2.58772,-10.418977 z m -30.678091,13.142892 8.103649,0 -2.89416,10.282782 -9.6018026,0 4.3923136,-10.282782 z m 10.929711,0 8.614384,0 0,10.282782 -11.508544,0 2.89416,-10.282782 z m 11.338299,0 8.852721,0 2.58772,10.282782 -11.440441,0 0,-10.282782 z m 11.678781,0 7.86531,0 4.39231,10.282782 -9.6699,0 -2.58772,-10.282782 z"></path></svg:svg></button></span><span class="cesium-navigationHelpButton-wrapper"><button type="button" class="cesium-button cesium-toolbar-button cesium-navigation-help-button" data-bind="attr: { title: tooltip },click: command,cesiumSvgPath: { path: _svgPath, width: 32, height: 32 }" title="Navigation Instructions"><svg:svg class="cesium-svgPath-svg" width="32" height="32" viewBox="0 0 32 32"><path d="M16,1.466C7.973,1.466,1.466,7.973,1.466,16c0,8.027,6.507,14.534,14.534,14.534c8.027,0,14.534-6.507,14.534-14.534C30.534,7.973,24.027,1.466,16,1.466z M17.328,24.371h-2.707v-2.596h2.707V24.371zM17.328,19.003v0.858h-2.707v-1.057c0-3.19,3.63-3.696,3.63-5.963c0-1.034-0.924-1.826-2.134-1.826c-1.254,0-2.354,0.924-2.354,0.924l-1.541-1.915c0,0,1.519-1.584,4.137-1.584c2.487,0,4.796,1.54,4.796,4.136C21.156,16.208,17.328,16.627,17.328,19.003z"></path></svg:svg></button><div class="cesium-navigation-help" data-bind="css: { "cesium-navigation-help-visible" : showInstructions}"><button type="button" class="cesium-navigation-button cesium-navigation-button-left cesium-navigation-button-selected" data-bind="click: showClick, css: {"cesium-navigation-button-selected": !_touch, "cesium-navigation-button-unselected": _touch}"><img src="https://cesium.com/downloads/cesiumjs/releases/1.87/Build/Cesium/Widgets/Images/NavigationHelp/Mouse.svg" class="cesium-navigation-button-icon" style="width: 25px; height: 25px;">Mouse</button><button type="button" class="cesium-navigation-button cesium-navigation-button-right cesium-navigation-button-unselected" data-bind="click: showTouch, css: {"cesium-navigation-button-selected": _touch, "cesium-navigation-button-unselected": !_touch}"><img src="https://cesium.com/downloads/cesiumjs/releases/1.87/Build/Cesium/Widgets/Images/NavigationHelp/Touch.svg" class="cesium-navigation-button-icon" style="width: 25px; height: 25px;">Touch</button><div class="cesium-click-navigation-help cesium-navigation-help-instructions cesium-click-navigation-help-visible" data-bind="css: { "cesium-click-navigation-help-visible" : !_touch}"> <table> <tbody><tr> <td><img src="https://cesium.com/downloads/cesiumjs/releases/1.87/Build/Cesium/Widgets/Images/NavigationHelp/MouseLeft.svg" width="48" height="48"></td> <td> <div class="cesium-navigation-help-pan">Pan view</div> <div class="cesium-navigation-help-details">Left click + drag</div> </td> </tr> <tr> <td><img src="https://cesium.com/downloads/cesiumjs/releases/1.87/Build/Cesium/Widgets/Images/NavigationHelp/MouseRight.svg" width="48" height="48"></td> <td> <div class="cesium-navigation-help-zoom">Zoom view</div> <div class="cesium-navigation-help-details">Right click + drag, or</div> <div class="cesium-navigation-help-details">Mouse wheel scroll</div> </td> </tr> <tr> <td><img src="https://cesium.com/downloads/cesiumjs/releases/1.87/Build/Cesium/Widgets/Images/NavigationHelp/MouseMiddle.svg" width="48" height="48"></td> <td> <div class="cesium-navigation-help-rotate">Rotate view</div> <div class="cesium-navigation-help-details">Middle click + drag, or</div> <div class="cesium-navigation-help-details">CTRL + Left/Right click + drag</div> </td> </tr> </tbody></table></div><div class="cesium-touch-navigation-help cesium-navigation-help-instructions" data-bind="css: { "cesium-touch-navigation-help-visible" : _touch}"> <table> <tbody><tr> <td><img src="https://cesium.com/downloads/cesiumjs/releases/1.87/Build/Cesium/Widgets/Images/NavigationHelp/TouchDrag.svg" width="70" height="48"></td> <td> <div class="cesium-navigation-help-pan">Pan view</div> <div class="cesium-navigation-help-details">One finger drag</div> </td> </tr> <tr> <td><img src="https://cesium.com/downloads/cesiumjs/releases/1.87/Build/Cesium/Widgets/Images/NavigationHelp/TouchZoom.svg" width="70" height="48"></td> <td> <div class="cesium-navigation-help-zoom">Zoom view</div> <div class="cesium-navigation-help-details">Two finger pinch</div> </td> </tr> <tr> <td><img src="https://cesium.com/downloads/cesiumjs/releases/1.87/Build/Cesium/Widgets/Images/NavigationHelp/TouchTilt.svg" width="70" height="48"></td> <td> <div class="cesium-navigation-help-rotate">Tilt view</div> <div class="cesium-navigation-help-details">Two finger drag, same direction</div> </td> </tr> <tr> <td><img src="https://cesium.com/downloads/cesiumjs/releases/1.87/Build/Cesium/Widgets/Images/NavigationHelp/TouchRotate.svg" width="70" height="48"></td> <td> <div class="cesium-navigation-help-tilt">Rotate view</div> <div class="cesium-navigation-help-details">Two finger drag, opposite direction</div> </td> </tr> </tbody></table></div></div></span></div><div class="cesium-viewer-animationContainer" style="width: 106px; height: 70px;"><div class="cesium-animation-theme"><div class="cesium-animation-themeNormal"></div><div class="cesium-animation-themeHover"></div><div class="cesium-animation-themeSelect"></div><div class="cesium-animation-themeDisabled"></div><div class="cesium-animation-themeKnob"></div><div class="cesium-animation-themePointer"></div><div class="cesium-animation-themeSwoosh"></div><div class="cesium-animation-themeSwooshHover"></div></div><svg:svg xmlns:xlink="http://www.w3.org/1999/xlink" width="106" height="70" viewBox="0 0 106 70" style="width: 106px; height: 70px; position: absolute; bottom: 0px; left: 0px; overflow: hidden;"><g transform="scale(0.53,0.5303030303030303)"><g class="cesium-animation-shuttleRingG"><circle class="cesium-animation-shuttleRingBack" cx="100" cy="100" r="99"></circle><g class="cesium-animation-shuttleRingSwoosh"><path transform="translate(100,97) scale(-1,1)" id="animation_pathSwooshFX" d="m 85,0 c 0,16.617 -4.813944,35.356 -13.131081,48.4508 h 6.099803 c 8.317138,-13.0948 13.13322,-28.5955 13.13322,-45.2124 0,-46.94483 -38.402714,-85.00262 -85.7743869,-85.00262 -1.0218522,0 -2.0373001,0.0241 -3.0506131,0.0589 45.958443,1.59437 82.723058,35.77285 82.723058,81.70532 z"></path><path transform="translate(100,97)" id="animation_pathSwooshFX" d="m 85,0 c 0,16.617 -4.813944,35.356 -13.131081,48.4508 h 6.099803 c 8.317138,-13.0948 13.13322,-28.5955 13.13322,-45.2124 0,-46.94483 -38.402714,-85.00262 -85.7743869,-85.00262 -1.0218522,0 -2.0373001,0.0241 -3.0506131,0.0589 45.958443,1.59437 82.723058,35.77285 82.723058,81.70532 z"></path><line x1="100" y1="8" x2="100" y2="22"></line></g><path class="cesium-animation-shuttleRingPausePointer" id="animation_pathPointer" d="M-15,-65,-15,-55,15,-55,15,-65,0,-95z" transform="translate(100,100) rotate(15)"></path></g><g transform="translate(100,100)"><circle class="cesium-animation-knobOuter" cx="0" cy="0" r="71" transform="rotate(15)"></circle><circle class="cesium-animation-knobInner" cx="0" cy="0" r="61"></circle><text x="0" y="-24" class="cesium-animation-svgText"><tspan>Sep 30 2024</tspan></text><text x="0" y="-7" class="cesium-animation-svgText"><tspan>07:41:00 UTC</tspan></text><text x="0" y="-41" class="cesium-animation-svgText"><tspan>1x</tspan></text><circle class="cesium-animation-blank" cx="0" cy="0" r="61"></circle></g><g><g class="cesium-animation-rectButton" transform="translate(3,4)"><path class="cesium-animation-buttonGlow" id="animation_pathWingButton" d="m 4.5,0.5 c -2.216,0 -4,1.784 -4,4 l 0,24 c 0,2.216 1.784,4 4,4 l 13.71875,0 C 22.478584,27.272785 27.273681,22.511272 32.5,18.25 l 0,-13.75 c 0,-2.216 -1.784,-4 -4,-4 l -24,0 z"></path><path class="cesium-animation-buttonMain" id="animation_pathWingButton" d="m 4.5,0.5 c -2.216,0 -4,1.784 -4,4 l 0,24 c 0,2.216 1.784,4 4,4 l 13.71875,0 C 22.478584,27.272785 27.273681,22.511272 32.5,18.25 l 0,-13.75 c 0,-2.216 -1.784,-4 -4,-4 l -24,0 z"></path><path class="cesium-animation-buttonPath" id="animation_pathClock" transform="translate(16,16) scale(0.85) translate(-16,-15.5)" d="M15.5,2.374C8.251,2.375,2.376,8.251,2.374,15.5C2.376,22.748,8.251,28.623,15.5,28.627c7.249-0.004,13.124-5.879,13.125-13.127C28.624,8.251,22.749,2.375,15.5,2.374zM15.5,25.623C9.909,25.615,5.385,21.09,5.375,15.5C5.385,9.909,9.909,5.384,15.5,5.374c5.59,0.01,10.115,4.535,10.124,10.125C25.615,21.09,21.091,25.615,15.5,25.623zM8.625,15.5c-0.001-0.552-0.448-0.999-1.001-1c-0.553,0-1,0.448-1,1c0,0.553,0.449,1,1,1C8.176,16.5,8.624,16.053,8.625,15.5zM8.179,18.572c-0.478,0.277-0.642,0.889-0.365,1.367c0.275,0.479,0.889,0.641,1.365,0.365c0.479-0.275,0.643-0.887,0.367-1.367C9.27,18.461,8.658,18.297,8.179,18.572zM9.18,10.696c-0.479-0.276-1.09-0.112-1.366,0.366s-0.111,1.09,0.365,1.366c0.479,0.276,1.09,0.113,1.367-0.366C9.821,11.584,9.657,10.973,9.18,10.696zM22.822,12.428c0.478-0.275,0.643-0.888,0.366-1.366c-0.275-0.478-0.89-0.642-1.366-0.366c-0.479,0.278-0.642,0.89-0.366,1.367C21.732,12.54,22.344,12.705,22.822,12.428zM12.062,21.455c-0.478-0.275-1.089-0.111-1.366,0.367c-0.275,0.479-0.111,1.09,0.366,1.365c0.478,0.277,1.091,0.111,1.365-0.365C12.704,22.344,12.54,21.732,12.062,21.455zM12.062,9.545c0.479-0.276,0.642-0.888,0.366-1.366c-0.276-0.478-0.888-0.642-1.366-0.366s-0.642,0.888-0.366,1.366C10.973,9.658,11.584,9.822,12.062,9.545zM22.823,18.572c-0.48-0.275-1.092-0.111-1.367,0.365c-0.275,0.479-0.112,1.092,0.367,1.367c0.477,0.275,1.089,0.113,1.365-0.365C23.464,19.461,23.3,18.848,22.823,18.572zM19.938,7.813c-0.477-0.276-1.091-0.111-1.365,0.366c-0.275,0.48-0.111,1.091,0.366,1.367s1.089,0.112,1.366-0.366C20.581,8.702,20.418,8.089,19.938,7.813zM23.378,14.5c-0.554,0.002-1.001,0.45-1.001,1c0.001,0.552,0.448,1,1.001,1c0.551,0,1-0.447,1-1C24.378,14.949,23.929,14.5,23.378,14.5zM15.501,6.624c-0.552,0-1,0.448-1,1l-0.466,7.343l-3.004,1.96c-0.478,0.277-0.642,0.889-0.365,1.365c0.275,0.479,0.889,0.643,1.365,0.367l3.305-1.676C15.39,16.99,15.444,17,15.501,17c0.828,0,1.5-0.671,1.5-1.5l-0.5-7.876C16.501,7.072,16.053,6.624,15.501,6.624zM15.501,22.377c-0.552,0-1,0.447-1,1s0.448,1,1,1s1-0.447,1-1S16.053,22.377,15.501,22.377zM18.939,21.455c-0.479,0.277-0.643,0.889-0.366,1.367c0.275,0.477,0.888,0.643,1.366,0.365c0.478-0.275,0.642-0.889,0.366-1.365C20.028,21.344,19.417,21.18,18.939,21.455z"></path><title>Today (real-time)</title></g><g class="cesium-animation-rectButton" transform="translate(44,99)"><rect class="cesium-animation-buttonGlow" width="32" height="32" rx="2" ry="2"></rect><rect class="cesium-animation-buttonMain" width="32" height="32" rx="4" ry="4"></rect><path class="cesium-animation-buttonPath" id="animation_pathPlayReverse" transform="translate(16,16) scale(-0.85,0.85) translate(-16,-16)" d="M6.684,25.682L24.316,15.5L6.684,5.318V25.682z"></path><title>Play Reverse</title></g><g class="cesium-animation-rectButton" transform="translate(124,99)"><rect class="cesium-animation-buttonGlow" width="32" height="32" rx="2" ry="2"></rect><rect class="cesium-animation-buttonMain" width="32" height="32" rx="4" ry="4"></rect><path class="cesium-animation-buttonPath" id="animation_pathPlay" transform="translate(16,16) scale(0.85) translate(-16,-16)" d="M6.684,25.682L24.316,15.5L6.684,5.318V25.682z"></path><title>Play Forward</title></g><g class="cesium-animation-rectButton cesium-animation-buttonToggled" transform="translate(84,99)"><rect class="cesium-animation-buttonGlow" width="32" height="32" rx="2" ry="2"></rect><rect class="cesium-animation-buttonMain" width="32" height="32" rx="4" ry="4"></rect><path class="cesium-animation-buttonPath" id="animation_pathPause" transform="translate(16,16) scale(0.85) translate(-16,-16)" d="M13,5.5,7.5,5.5,7.5,25.5,13,25.5zM24.5,5.5,19,5.5,19,25.5,24.5,25.5z"></path><title>Pause</title></g></g></g><defs><linearGradient id="animation_buttonNormal" x1="50%" y1="0%" x2="50%" y2="100%"><stop offset="0%" stop-color="rgb(116,117,119)"></stop><stop offset="12%" stop-color="rgb(57,68,82)"></stop><stop offset="46%" stop-color="rgb(45,50,55)"></stop><stop offset="81%" stop-color="rgb(53,53,53)"></stop></linearGradient><linearGradient id="animation_buttonHovered" x1="50%" y1="0%" x2="50%" y2="100%"><stop offset="0%" stop-color="rgb(137,180,207)"></stop><stop offset="12%" stop-color="rgb(84,148,193)"></stop><stop offset="46%" stop-color="rgb(76,142,184)"></stop><stop offset="81%" stop-color="rgb(84,146,183)"></stop></linearGradient><linearGradient id="animation_buttonToggled" x1="50%" y1="0%" x2="50%" y2="100%"><stop offset="0%" stop-color="rgb(116,138,119)"></stop><stop offset="12%" stop-color="rgb(57,94,82)"></stop><stop offset="46%" stop-color="rgb(45,80,55)"></stop><stop offset="81%" stop-color="rgb(53,84,53)"></stop></linearGradient><linearGradient id="animation_buttonDisabled" x1="50%" y1="0%" x2="50%" y2="100%"><stop offset="0%" stop-color="rgb(105,105,105)"></stop><stop offset="75%" stop-color="rgb(51,51,51)"></stop></linearGradient><filter id="animation_blurred" width="200%" height="200%" x="-50%" y="-50%"><feGaussianBlur stdDeviation="4" in="SourceGraphic"></feGaussianBlur></filter><linearGradient id="animation_shuttleRingSwooshGradient" x1="50%" y1="0%" x2="50%" y2="100%"><stop offset="0%" stop-opacity="0.2" stop-color="rgb(136,170,204)"></stop><stop offset="85%" stop-opacity="0.85" stop-color="rgb(136,170,204)"></stop><stop offset="95%" stop-opacity="0.05" stop-color="rgb(136,170,204)"></stop></linearGradient><linearGradient id="animation_shuttleRingSwooshHovered" x1="50%" y1="0%" x2="50%" y2="100%"><stop offset="0%" stop-opacity="0.2" stop-color="rgb(170,238,255)"></stop><stop offset="85%" stop-opacity="0.85" stop-color="rgb(170,238,255)"></stop><stop offset="95%" stop-opacity="0.05" stop-color="rgb(170,238,255)"></stop></linearGradient><linearGradient id="animation_shuttleRingPointerGradient" x1="0%" y1="50%" x2="100%" y2="50%"><stop offset="0%" stop-color="rgb(34,238,34)"></stop><stop offset="40%" stop-color="rgb(34,238,34)"></stop><stop offset="60%" stop-color="rgb(17,119,17)"></stop><stop offset="100%" stop-color="rgb(17,119,17)"></stop></linearGradient><linearGradient id="animation_shuttleRingPointerPaused" x1="0%" y1="50%" x2="100%" y2="50%"><stop offset="0%" stop-color="#CCC"></stop><stop offset="40%" stop-color="#CCC"></stop><stop offset="60%" stop-color="#555"></stop><stop offset="100%" stop-color="#555"></stop></linearGradient><linearGradient id="animation_knobOuter" x1="20%" y1="0%" x2="90%" y2="100%"><stop offset="5%" stop-color="rgb(116,117,119)"></stop><stop offset="60%" stop-color="rgb(43,44,44)"></stop><stop offset="85%" stop-color="rgb(57,68,82)"></stop></linearGradient><linearGradient id="animation_knobInner" x1="20%" y1="0%" x2="90%" y2="100%"><stop offset="5%" stop-color="rgb(43,44,44)"></stop><stop offset="60%" stop-color="rgb(116,117,119)"></stop><stop offset="85%" stop-color="rgb(53,53,53)"></stop></linearGradient></defs></svg:svg></div><div class="cesium-viewer-timelineContainer" style="right: 29px; left: 106px;"><div class="cesium-timeline-main"><div class="cesium-timeline-bar"><span class="cesium-timeline-ticTiny" style="left: -9px;"></span><span class="cesium-timeline-ticTiny" style="left: 4px;"></span><span class="cesium-timeline-ticTiny" style="left: 17px;"></span><span class="cesium-timeline-ticTiny" style="left: 30px;"></span><span class="cesium-timeline-ticTiny" style="left: 42px;"></span><span class="cesium-timeline-ticTiny" style="left: 55px;"></span><span class="cesium-timeline-ticTiny" style="left: 68px;"></span><span class="cesium-timeline-ticTiny" style="left: 81px;"></span><span class="cesium-timeline-ticTiny" style="left: 93px;"></span><span class="cesium-timeline-ticTiny" style="left: 106px;"></span><span class="cesium-timeline-ticTiny" style="left: 119px;"></span><span class="cesium-timeline-ticTiny" style="left: 132px;"></span><span class="cesium-timeline-ticTiny" style="left: 144px;"></span><span class="cesium-timeline-ticTiny" style="left: 157px;"></span><span class="cesium-timeline-ticTiny" style="left: 170px;"></span><span class="cesium-timeline-ticTiny" style="left: 183px;"></span><span class="cesium-timeline-ticTiny" style="left: 195px;"></span><span class="cesium-timeline-ticTiny" style="left: 208px;"></span><span class="cesium-timeline-ticTiny" style="left: 221px;"></span><span class="cesium-timeline-ticTiny" style="left: 234px;"></span><span class="cesium-timeline-ticTiny" style="left: 246px;"></span><span class="cesium-timeline-ticTiny" style="left: 259px;"></span><span class="cesium-timeline-ticTiny" style="left: 272px;"></span><span class="cesium-timeline-ticTiny" style="left: 285px;"></span><span class="cesium-timeline-ticTiny" style="left: 297px;"></span><span class="cesium-timeline-ticSub" style="left: -21px;"></span><span class="cesium-timeline-ticSub" style="left: 55px;"></span><span class="cesium-timeline-ticSub" style="left: 132px;"></span><span class="cesium-timeline-ticSub" style="left: 208px;"></span><span class="cesium-timeline-ticSub" style="left: 285px;"></span><span class="cesium-timeline-ticMain" style="left: -98px;"></span><span class="cesium-timeline-ticLabel" style="left: -166.5px;">Sep 30 2024 00:00:00 UTC</span><span class="cesium-timeline-ticMain" style="left: 55px;"></span><span class="cesium-timeline-ticLabel" style="left: -13.5px;">Sep 30 2024 12:00:00 UTC</span><span class="cesium-timeline-ticMain" style="left: 208px;"></span><span class="cesium-timeline-ticLabel" style="left: 143.5px;">Oct 1 2024 00:00:00 UTC</span><span class="cesium-timeline-ticMain" style="left: 361px;"></span><span class="cesium-timeline-ticLabel" style="left: 296.5px;">Oct 1 2024 12:00:00 UTC</span><span class="cesium-timeline-icon16" style="left:-8px;bottom:0;background-position: 0 0;"></span></div><div class="cesium-timeline-trackContainer" style="height: 27px;"><canvas class="cesium-timeline-tracks" width="306" height="1" style="height: 1px;"></canvas></div><div class="cesium-timeline-needle" style="left: 0px;"></div><span class="cesium-timeline-ruler">Oct 1 2024 12:00:00 UTC</span></div></div><div class="cesium-viewer-fullscreenContainer" style="display: block;"><button type="button" class="cesium-button cesium-fullscreenButton" data-bind="attr: { title: tooltip },click: command,enable: isFullscreenEnabled,cesiumSvgPath: { path: isFullscreen ? _exitFullScreenPath : _enterFullScreenPath, width: 128, height: 128 }" title="Full screen"><svg:svg class="cesium-svgPath-svg" width="128" height="128" viewBox="0 0 128 128"><path d="M 83.96875 17.5625 L 83.96875 17.59375 L 76.65625 24.875 L 97.09375 24.96875 L 76.09375 45.96875 L 81.9375 51.8125 L 102.78125 30.9375 L 102.875 51.15625 L 110.15625 43.875 L 110.1875 17.59375 L 83.96875 17.5625 z M 44.125 17.59375 L 17.90625 17.625 L 17.9375 43.90625 L 25.21875 51.1875 L 25.3125 30.96875 L 46.15625 51.8125 L 52 45.96875 L 31 25 L 51.4375 24.90625 L 44.125 17.59375 z M 46.0625 76.03125 L 25.1875 96.875 L 25.09375 76.65625 L 17.8125 83.9375 L 17.8125 110.21875 L 44 110.25 L 51.3125 102.9375 L 30.90625 102.84375 L 51.875 81.875 L 46.0625 76.03125 z M 82 76.15625 L 76.15625 82 L 97.15625 103 L 76.71875 103.0625 L 84.03125 110.375 L 110.25 110.34375 L 110.21875 84.0625 L 102.9375 76.8125 L 102.84375 97 L 82 76.15625 z"></path></svg:svg></button></div></div></div>
<div class="cesium-viewer-toolbar" style="left: 50px;top: 100px;width: max-content">
<fieldset>
<legend>在线地图</legend>
<ul id="ImageryProvider"><li>
<span style="margin-left: 10px;flex:1">全球街道地图的底图</span><label class="switch">
<input type="checkbox" vieweroption="{"label":"全球街道地图的底图","name":"全球街道地图的底图","loadType":"ArcGisMapServerImageryProvider","url":"https://services.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer"}" onclick="toggleSwitches(this)">
<span class="slider round"></span>
</label>
</li><li>
<span style="margin-left: 10px;flex:1">全球卫星图像的底图</span><label class="switch">
<input type="checkbox" vieweroption="{"label":"全球卫星图像的底图","name":"全球卫星图像的底图","loadType":"ArcGisMapServerImageryProvider","url":"https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer"}" onclick="toggleSwitches(this)">
<span class="slider round"></span>
</label>
</li><li>
<span style="margin-left: 10px;flex:1">高德街道底图</span><label class="switch">
<input type="checkbox" vieweroption="{"label":"高德街道底图","name":"高德街道底图","loadType":"UrlTemplateImageryProvider","url":"http://webrd02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}"}" onclick="toggleSwitches(this)">
<span class="slider round"></span>
</label>
</li><li>
<span style="margin-left: 10px;flex:1">天地图</span><label class="switch">
<input type="checkbox" vieweroption="{"label":"天地图","name":"天地图","loadType":"TianDiTuImageryProvider","url":""}" onclick="toggleSwitches(this)">
<span class="slider round"></span>
</label>
</li></ul>
</fieldset>
<fieldset>
<legend>地形</legend>
<ul id="TerrainProvider"><li>
<span style="margin-left: 10px;flex:1">使用全球地形服务</span><label class="switch">
<input type="checkbox" vieweroption="{"name":"使用全球地形服务","loadType":"CesiumTerrainProvider","url":"https://www.supermapol.com/realspace/services/3D-stk_terrain/rest/realspace/datas/info/data/path/"}" onclick="toggleSwitches(this)">
<span class="slider round"></span>
</label>
</li></ul>
</fieldset>
<fieldset>
<legend>白膜</legend>
<ul id="WhiteMembrane"><li>
<span style="margin-left: 10px;flex:1">保定白膜-geojson数据</span><label class="switch">
<input type="checkbox" vieweroption="{"name":"保定白膜-geojson数据","loadType":"GeoJsonDataSource","url":"../baoding_shiliang.geojson"}" onclick="toggleSwitches(this)">
<span class="slider round"></span>
</label>
</li><li>
<span style="margin-left: 10px;flex:1">北京白膜-tileset数据</span><label class="switch">
<input type="checkbox" vieweroption="{"name":"北京白膜-tileset数据","loadType":"Cesium3DTileset","url":"http://117.133.182.90:1151/data/blocksystem/beiJingBuildingWhite/tileset.json"}" onclick="toggleSwitches(this)">
<span class="slider round"></span>
</label>
</li></ul>
</fieldset>
<fieldset>
<legend>BIM</legend>
<ul id="BIMLayer"><li>
<span style="margin-left: 10px;flex:1">BIM模型</span><label class="switch">
<input type="checkbox" vieweroption="{"name":"BIM模型","loadType":"Cesium3DTileset","url":"http://117.133.182.90:1151/data/bim/building8/tileset.json"}" onclick="toggleSwitches(this)">
<span class="slider round"></span>
</label>
</li></ul>
</fieldset>
</div>
<script>
var viewer = null;
//创建Cesium Viewer实例
function createViewer() {
// 创建Cesium Viewer实例
// var viewer = new Cesium.Viewer('cesiumContainer', {
// imageryProvider: new Cesium.ArcGisMapServerImageryProvider({
// url: 'https://services.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer' //全球街道地图的底图
// }),
// baseLayerPicker: false,
// additionalImageryProviderViewModels: [{
// provider: new Cesium.ArcGisMapServerImageryProvider({
// url: 'https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer' //全球卫星图像的底图
//
// }),
// show: true
// }],
// alpha: 0.5 // 设置透明度为0.5
//
// });
var viewer = new Cesium.Viewer('cesiumContainer', {imageryProvider: false, baseLayerPicker: false});
return viewer;
}
// 添加矢量数据图层（例如，绘制一个多边形）
function addPolygon() {
var polygon = new Cesium.PolygonGraphics({
show: true,
positions: Cesium.Cartesian3.fromDegreesArray([
-123.0, 45.0,
-122.0, 45.0,
-122.0, 46.0,
-123.0, 46.0,
-123.0, 45.0
]),
material: Cesium.Color.RED.withAlpha(0.5)
});
viewer.entities.add({
polygon: polygon
});
}
// 添加标注（例如，在地图上显示一个点和文本标签）
function addLabel() {
var point = viewer.entities.add({
position: Cesium.Cartesian3.fromDegrees(-122.0, 45.0, 100),
point: {
pixelSize: 10,
color: Cesium.Color.YELLOW
},
label: {
text: 'Sample Point',
font: '24px sans-serif',
fillColor: Cesium.Color.BLACK,
outlineColor: Cesium.Color.WHITE,
outlineWidth: 2,
style: Cesium.LabelStyle.FILL_AND_OUTLINE,
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
pixelOffset: new Cesium.Cartesian2(0, -9)
}
});
}
// 定义定位函数 // 方位角、俯仰角和翻滚角可以根据需要进行调整
// azimuth = 0; // 方位角
// pitch = -90; // 俯仰角，-90度表示正上方
// roll = 0; // 翻滚角
function flyOriginViewpoint(longitude, latitude, height, azimuth, pitch, roll) {
var destination = Cesium.Cartesian3.fromDegrees(longitude, latitude, height);
viewer.camera.flyTo({
destination: destination,
orientation: {
heading: Cesium.Math.toRadians(azimuth),
pitch: Cesium.Math.toRadians(pitch),
roll: Cesium.Math.toRadians(roll)
},
duration: 3 // 飞行时间（s）
});
}
function operatingPanel() {
//图层控制面板
let list = [
{
type: 'ImageryProvider', name: '在线地图', children: [{
label: '全球街道地图的底图',
name: '全球街道地图的底图',
loadType: 'ArcGisMapServerImageryProvider',
url: 'https://services.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer'
},
{
label: '全球卫星图像的底图',
name: '全球卫星图像的底图',
loadType: 'ArcGisMapServerImageryProvider',
url: 'https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer'
},
{
label: '高德街道底图',
name: '高德街道底图',
loadType: 'UrlTemplateImageryProvider',
url: 'http://webrd02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}'
},
{
label: '天地图',
name: '天地图',
loadType: 'TianDiTuImageryProvider',
url: ''
}
]
},
{
type: 'TerrainProvider', name: '地形', children: [{
name: '使用全球地形服务',
loadType: 'CesiumTerrainProvider',
url: 'https://www.supermapol.com/realspace/services/3D-stk_terrain/rest/realspace/datas/info/data/path/'
}]
},
{
type: 'WhiteMembrane', name: '白膜', children: [{
name: '保定白膜-geojson数据',
loadType: 'GeoJsonDataSource',
url: '../baoding_shiliang.geojson'
}, {
name: '北京白膜-tileset数据',
loadType: 'Cesium3DTileset',
url: 'http://117.133.182.90:1151/data/blocksystem/beiJingBuildingWhite/tileset.json'
}]
},
{
type: 'BIMLayer', name: 'BIM模型', children: [{
name: 'BIM模型',
loadType: 'Cesium3DTileset',
url: 'http://117.133.182.90:1151/data/bim/building8/tileset.json'
}]
}
]
for (const object of list) {
createSwitchList(object.children, object.type);
}
}
// 检查图层是否存在并获取 地形不能通过这个获取
function getLayerByName(layerName) {
var layers = viewer.imageryLayers;
for (var i = 0; i < layers.length; i++) {
console.log(layers.get(i).name + " ------------ ")
if (layers.get(i).name === layerName) {
return layers.get(i);
}
}
return null;
}
//天地图矢量
function TituVecMapProvider(key) {
return new Cesium.WebMapTileServiceImageryProvider({
label: '天地图矢量',
loadType: 'WebMapTileServiceImageryProvider',
url: "http://{s}.tianditu.gov.cn/vec_w/wmts?tk=" + key + "&service=wmts&request=GetTile&version=1.0.0&LAYER=vec&tileMatrixSet=w&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}&style=default&format=tiles",
layer: "tdtVecBasicLayer",
style: "default",
format: "tiles",
minimumLevel: 0,
subdomains: ["t0", "t1", "t2", "t3", "t4", "t5", "t6"],
maximumLevel: 18,
tileMatrixSetID: "GoogleMapsCompatible",
})
}
//新加图层
function addProvider(viewerOption) {
console.log('新增图层' + viewerOption.name)
let imageryProvider = null;
switch (viewerOption.loadType) {
case 'ArcGisMapServerImageryProvider'://全球街道地图的底图 全球卫星图像的底图
imageryProvider = new Cesium.ArcGisMapServerImageryProvider(viewerOption);
break;
case 'CesiumTerrainProvider'://使用全球地形服务
viewer.terrainProvider = new Cesium.CesiumTerrainProvider(viewerOption);
break;
case 'UrlTemplateImageryProvider'://高德街道底图
imageryProvider = new Cesium.UrlTemplateImageryProvider(viewerOption);
break;
case 'TianDiTuImageryProvider'://天地图
imageryProvider = TituVecMapProvider('key 需要申请');
break;
case 'GeoJsonDataSource'://geojson
addGeoJson(viewerOption.url);
break;
case 'Cesium3DTileset'://tileset
addTileset(viewerOption.url, viewerOption.name);
break
case 'UrlTemplateImageryProvider':// 添加BIM模型
imageryProvider = new Cesium.UrlTemplateImageryProvider(viewerOption);
break
}
//将地图加载到图层
if (imageryProvider != null && viewerOption.loadType.includes('ImageryProvider')) {
imageryProvider.name = viewerOption.name
viewer.imageryLayers.addImageryProvider(imageryProvider);
}
}
//它接受一个HTML元素作为参数。函数会遍历元素的父元素，直到找到一个ul标签或者到达根元素。如果找到了ul标签，就返回该标签；否则返回null
function getClosestUlAboveElement(element) {
let currentElement = element.parentElement;
while (currentElement !== null) {
if (currentElement.tagName === 'UL') {
return currentElement;
}
currentElement = currentElement.parentElement;
}
return null;
}
// 函数用于移除具有特定标识的Cesium3DTileset
function removeTilesetByName(name) {
const primitives = viewer.scene.primitives;
for (let i = 0; i < primitives.length; i++) {
const primitive = primitives.get(i);
if (primitive instanceof Cesium.Cesium3DTileset && primitive.name === name) {
primitives.remove(primitive);
break;
}
}
}
// 函数用于移除具有特定标识的DataSources
function removeDataSourcesByName(url) {
const dataSources = viewer.dataSources;
for (let i = 0; i < dataSources.length; i++) {
const dataSource = dataSources.get(i);
if (dataSource.name === url) {
dataSources.remove(dataSource);
break;
}
}
}
function toggleSwitches(clickedCheckbox) {
//被选中加载图层,从标签中获取选中图层信息
let viewerOption = clickedCheckbox.getAttribute('vieweroption');
let jsonViewerOption = JSON.parse(viewerOption);
//获取UL图层
let closestUlAboveElement = getClosestUlAboveElement(clickedCheckbox);
//判断是不是地图
if (closestUlAboveElement.id.includes('ImageryProvider')) {
//判断图层是否存在
let layer = getLayerByName(jsonViewerOption.name);
//获取所在ul中的所有input
const checkboxes = closestUlAboveElement.querySelectorAll('input[type="checkbox"]');
if (clickedCheckbox.checked) {
checkboxes.forEach(checkbox => {
if (checkbox !== clickedCheckbox) {
checkbox.checked = false;
//如何已经加入到图层了，逻辑删除：隐藏
let attribute = checkbox.getAttribute('vieweroption');
let name = JSON.parse(attribute).name;
let layer = getLayerByName(name);
if (layer !== null) {
console.log(name + " 已加入图层，未选中将隐藏")
layer.alpha = 0;
} else {
//console.log(name+" 未加入图层，忽略处理")
}
}
});
if (layer != null) {
//存在则直接升至顶层，显示非隐藏
console.log(jsonViewerOption.name + " 已加入图层，选中升至顶层")
layer.alpha = 1;
viewer.imageryLayers.raiseToTop(layer);
} else {
//不存在则新增到图层中
console.log(jsonViewerOption.name + " 未加入图层，加入图层")
addProvider(jsonViewerOption)
}
} else {
console.log(jsonViewerOption.name + "已加入图层，隐藏图层")
layer.alpha = 0;
}
//判断是不是地形
} else if (closestUlAboveElement.id.includes('TerrainProvider')) {
if (clickedCheckbox.checked) {
//地形被选中重置地形
console.log("替换重置地形")
addProvider(jsonViewerOption)
} else {
console.log("取消地形 物理删除，禁止地形的频繁切换 谨慎操作 容易报错")
// 假设 viewer 已经初始化并加载了场景
if (viewer && viewer.scene) {
// 检查是否存在地形提供者
if (viewer.terrainProvider) {
// 移除地形提供者 使用默认的椭球体参数来生成地形数据 禁止使用 viewer.terrainProvider = null
viewer.terrainProvider = new Cesium.EllipsoidTerrainProvider({});
console.log("地形被移除");
} else {
console.log("没有可移除的地形");
}
} else {
console.error("初始化未完成");
}
}
//判断是不是白膜
} else if (closestUlAboveElement.id.includes('WhiteMembrane')) {
if (clickedCheckbox.checked) {
addProvider(jsonViewerOption)
} else {
if (jsonViewerOption.loadType === 'GeoJsonDataSource') {
removeDataSourcesByName(jsonViewerOption.url.split("/").pop())
} else if (jsonViewerOption.loadType === 'Cesium3DTileset') {
removeTilesetByName(jsonViewerOption.name)
}
}
}else if (closestUlAboveElement.id.includes('BIMLayer')){
if (clickedCheckbox.checked) {
addProvider(jsonViewerOption)
//定位过去
viewer.camera.flyTo({
destination: new Cesium.Cartesian3(
-2182915.135110289,
4385993.962449573,
4070306.52233875
),
orientation: {
heading: 0.013305661166348237,
pitch: -0.09937531391356114,
roll: 7.697513737525696e-10,
},
duration: 3 // 飞行时间（s）
});
} else {
// let layer = getLayerByName(getLayerByName.name);
// layer.alpha = 0;
// //飞到指定位置
// flyOriginViewpoint(
// 115.86166000000003, 39.042780000000015,
// 6750.484697934106,
// 5.196694897930147,
// // -0.17778788602137952,
// -90,
// 0.0
// );
removeTilesetByName(jsonViewerOption.name)
}
}
}
//新增geojson数据 注意坐标 高德地图可能使用的是GCJ-02 Cesium默认使用的是WGS84经纬度坐标系
function addGeoJson(geojsonUrl) {
let load = Cesium.GeoJsonDataSource.load(geojsonUrl, {
stroke: Cesium.Color.RED,
fill: Cesium.Color.RED.withAlpha(0.5),
strokeWidth: 3
});
return viewer.dataSources.add(load).then(function (dataSource) {
viewer.zoomTo(dataSource);
});
}
//新增瓦片
function addTileset(url, name) {
var tileset = new Cesium.Cesium3DTileset({
url: url
});
tileset.name = name;
return viewer.scene.primitives.add(tileset);
}
function createSwitchList(list,id) {
const listGroup = document.getElementById(id);
listGroup.innerHTML = ''; // 清空列表组内容
for (const object of list) {
const listItem = document.createElement('li');
listItem.innerHTML = `
<span style="margin-left: 10px;flex:1">${object.name}</span><label class="switch">
<input type="checkbox" vieweroption='${JSON.stringify(object)}' οnclick="toggleSwitches(this)" />
<span class="slider round"></span>
</label>
`;
listGroup.appendChild(listItem);
}
}
window.onload = function () {
// 创建Cesium Viewer实例
viewer = createViewer();
console.log('创建Cesium Viewer实例 禁用默认的图层切换和地图')
// 启用帧率显示
viewer.scene.debugShowFramesPerSecond = true;
//平线上的朦胧效果
viewer.scene.globe.showGroundAtmosphere = true;
//图层控制面板 对图层进行逻辑删除：即隐藏
operatingPanel();
console.log('创建图层控制面板')
// 设置场景的屏幕门控器
var handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
// 监听鼠标左键单击事件
handler.setInputAction(function (movement) {
var pick = viewer.scene.pick(movement.position);
if (Cesium.defined(pick)) {
// 检测到实体被点击
// var pickedEntity = pick.id;
if (pick instanceof Cesium.Cesium3DTileFeature) {
// 获取特征的属性
var propertyNames = pick.getPropertyNames();
// console.log('3DTile 属性名称：', propertyNames);
console.log('瓦片3DTile被点击')
// 遍历属性名称并获取每个属性的值
for (var i = 0; i < propertyNames.length; i++) {
var propertyName = propertyNames[i];
var propertyValue = pick.getProperty(propertyName);
console.log('属性名： ' + propertyName + ', 属性值： ', propertyValue);
}
}else {
console.log('暂未监听')
console.log(pick)
alert("暂未监听")
}
}
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
// //标注
// addLabel();
//飞到指定位置
flyOriginViewpoint(
115.86166000000003, 39.042780000000015,
6750.484697934106,
5.196694897930147,
// -0.17778788602137952,
-90,
0.0
);
}
</script>
</body></html>
扫一扫
1155
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
