cesium 实现中文搜索定位

• 思路：利用高德的中文定位搜索获取选中定位的经纬度，cesium进行3D锚点定位
• 准备：申请高德开发者的密钥，嵌在页面中，建议放在最后

< script src=“https://webapi.amap.com/maps?v=1.4.10&key=高德开发者密钥&plugin=AMap.PlaceSearch”>

• 页面调用元素：

• js代码：

  function autoInput(t){
       debugger
       if(!t){
           return;
       }
       var keywords = t.value;
       if(t.value==""){
           document.getElementById("search_results_div").innerHTML="";
           document.getElementById("search_results_div").style.display="none";
           return;
       }
       AMap.plugin('AMap.PlaceSearch', function(){
           var autoOptions = {city: '全国'};
           var placeSearch = new AMap.PlaceSearch(autoOptions);
           placeSearch.search(keywords, function(status, result) {
               console.log("status");
               console.log(status);
               if(status=="complete"){    // no_data
                   if(result.info=="OK"){
                       if(result.poiList&&result.poiList.count>0){
                           var poiList=result.poiList.pois;
                           console.log("result.poiList.pois: ");
                           console.log(poiList);
                               let poiListCount=result.poiList.count;
                               var htmlTmp="";
                               for(var i=0;i" +poiList[i].name+
                                       " "+poiList[i].address+"\n" +
                                       "

"; htmlTmp=htmlTmp+htmlTmp1; // 查询结果对象存储，用于点击的3D定位 } document.getElementById("search_results_div").innerHTML=htmlTmp; }else { document.getElementById("search_results_div").innerHTML="无搜索结果"; } }else { document.getElementById("search_results_div").innerHTML="无搜索结果"; } }else{ document.getElementById("search_results_div").innerHTML="无搜索结果"; } document.getElementById("search_results_div").style.display="block"; }) }) } //核心就是利用高德的插件获取经纬度啦 //cesium组件 用于定位，视野 var loactionEntity; //点击事件 选中一个地点，3D跳转到 function setmapToBylngAndLat(t) { var longitude =t.getAttribute("data-longitude"); var latitude =t.getAttribute("data-latitude"); if(loactionEntity) viewer.entities.remove(loactionEntity); loactionEntity = new Cesium.Entity({ id : 'flyTmp', position : Cesium.Cartesian3.fromDegrees(longitude, latitude), point : { pixelSize : 10, color : Cesium.Color.WHITE.withAlpha(0.9), outlineColor : Cesium.Color.WHITE.withAlpha(0.9), outlineWidth : 1 } }); viewer.entities.add(loactionEntity); viewer.flyTo(loactionEntity, { offset : { heading : Cesium.Math.toRadians(0.0), pitch : Cesium.Math.toRadians(-90), range : 10000 } }); document.getElementById("search_results_div").style.display="block"; }

效果演示截图：