diff --git a/public/js/globe.js b/public/js/globe.js index f15ec8e64b984ca17bf4b6ceffb3724f88a3ecc2..e863868e09ffe5d056f99d9037508218471cc905 100644 --- a/public/js/globe.js +++ b/public/js/globe.js @@ -9,14 +9,48 @@ var viewer = new Cesium.Viewer('cesiumContainer', { animation: false, sceneModePicker: false, geocoder: false, - + sceneMode : Cesium.SceneMode.SCENE3D }); viewer.scene.globe.depthTestAgainstTerrain = true; //--------------------hover over surfaces-------------------- var singleChart = document.getElementById('singleChartContainer'); -//console.log(viewer.ShadowMap); + +//load address +var request = new XMLHttpRequest(); +request.onreadystatechange = function(){ + if(this.readyState == 4 && this.status == 200){ + +var coordinate = JSON.parse(request.responseText); +var lat = coordinate.results[0].geometry.lat; +var lng = coordinate.results[0].geometry.lng; +console.log(lat + " " + lng); +fly(lat, lng); + } +} +function searchaddress(){ + var query = document.getElementById('SearchAddress').value; + request.open("GET",'https://api.opencagedata.com/geocode/v1/json?key=c73da14969e6408ab4535b3ad6dc43ea&pretty=1&no_annotations=1&q=' + query, true); + request.send(); +} + +function fly( lat, lng){ + var pinBuilder = new Cesium.PinBuilder(); + +var bluePin = viewer.entities.add({ + name: "Blank blue pin", + position: Cesium.Cartesian3.fromDegrees(lng, lat), + billboard: { + image: pinBuilder.fromColor(Cesium.Color.ROYALBLUE, 48).toDataURL(), + verticalOrigin: Cesium.VerticalOrigin.BOTTOM, + }, +}); + viewer.zoomTo(bluePin); + + viewer.flyTo(bluePin); + +} // HTML overlay for showing feature name on mouseover var nameOverlay = document.createElement("div"); diff --git a/public/main.html b/public/main.html index 034e67cb64f968bf7250526a59ff414c12f86816..e0489ecf9531c76d53b6be8808d6a7ad3c6529d9 100644 --- a/public/main.html +++ b/public/main.html @@ -236,6 +236,13 @@ <br><br> <input id="submitID" type="button" class="btn btn-primary" value="Submit"> </div> +<!--SELECT Adresse--> +<div class="item"> + <label class="lang" key="chooseaarea" id="arealabel" for="SearchAddress">Search Address:</label> + <input id="SearchAddress" type="text" name="SearchAddress" > + <br><br> + <input id="SerachID" type="button" onclick="searchaddress()" class="btn btn-primary" value="Search"> +</div> <!--SELECT VIEW--> <div class="item"> <div id="radio-group" class="cc-selector">