//模块: var widget_queryBaiduPOI = xjsdk.widget.bindClass(xjsdk.widget.BaseWidget.extend({ options: { resources: [ 'view.css', "./lib/cesiumjs/plugins/class/BaiduPOI.js" //百度poi查询 ], //直接添加到index view: { type: "append", url: 'view.html', parent: 'body' }, }, //初始化[仅执行1次] create: function () { this.baiduPOI = new BaiduPOI(); }, //每个窗口创建完成后调用 winCreateOK: function (opt, result) { if (opt.type != "append") return; var that = this; var img = $('#map-querybar img'); img.each(function (index, item) { $(item).attr('src', that.path + $(item).attr('src')); }); if (that.config.position) $("#map-querybar").css(that.config.position); if (that.config.style) $("#map-querybar").css(that.config.style); // 搜索框 $("#txt_querypoi").click(function () { // 文本框内容为空 if ($.trim($(this).val()).length == 0) { that.hideAllQueryBarView(); that.showHistoryList(); // 显示历史记录 } }); var timetik = 0; // 搜索框绑定文本框值发生变化,隐藏默认搜索信息栏,显示匹配结果列表 $("#txt_querypoi").bind("input propertychange", function () { clearTimeout(timetik); timetik = setTimeout(function () { that.hideAllQueryBarView(); that.clearLayers(); var queryVal = $.trim($("#txt_querypoi").val()); if (queryVal.length == 0) { // 文本框内容为空,显示历史记录 that.showHistoryList(); } else { that.autoTipList(queryVal, true); } }, 500); }); // 点击搜索查询按钮 $("#btn_querypoi").click(function () { clearTimeout(timetik); that.hideAllQueryBarView(); var queryVal = $.trim($("#txt_querypoi").val()); that.strartQueryPOI(queryVal, true); }); //绑定回车键 $("#txt_querypoi").bind('keydown', function (event) { if (event.keyCode == "13") { $("#btn_querypoi").click(); } }); // 返回查询结果面板界面 $("#querybar_detail_back").click(function () { that.hideAllQueryBarView(); $("#querybar_resultlist_view").show(); }); }, //打开激活 activate: function () { var that = this; //单击事件 this.handler = new Cesium.ScreenSpaceEventHandler(this.viewer.scene.canvas); this.handler.setInputAction(function () { // 点击地图区域,隐藏所有弹出框 if ($.trim($("#txt_querypoi").val()).length == 0) { that.hideAllQueryBarView(); $("#txt_querypoi").blur(); } }, Cesium.ScreenSpaceEventType.LEFT_CLICK); }, //关闭释放 disable: function () { if (this.handler) { this.handler.destroy(); delete this.handler } this.hideAllQueryBarView(); this.clearLayers(); }, hideAllQueryBarView: function () { $("#querybar_histroy_view").hide(); $("#querybar_autotip_view").hide(); $("#querybar_detail_view").hide(); $("#querybar_resultlist_view").hide(); }, // 点击面板条目,自动填充搜索框,并展示搜索结果面板 autoSearch: function (name) { $("#txt_querypoi").val(name); $("#btn_querypoi").trigger("click"); }, //===================与后台交互======================== //显示智能提示搜索结果 autoTipList: function (text, queryEx) { //输入经纬度数字时 if (this.isLonLat(text)) return; //查询外部widget if (this.hasExWidget() && queryEx) { var qylist = this.autoExTipList(text); return; } //查询外部widget this.baiduPOI.autoTip({ text: text, location: this.viewer.xjsdk.getCenter(), success: function (result) { var inhtml = ""; var pois = result.list; for (var index = 0; index < pois.length; index++) { var name = pois[index].name; // var num = pois[index].num; // if (num > 0) continue; inhtml += "
  • " + name + "
  • "; } if (inhtml.length > 0) { $("#querybar_ul_autotip").html(inhtml); $("#querybar_autotip_view").show(); } } }); }, // 根据输入框内容,查询显示列表 queryText: null, strartQueryPOI: function (text, queryEx) { if (text.length == 0) { toastr.warning('请输入搜索关键字!'); return; } // TODO:根据文本框输入内容,从数据库模糊查询到所有匹配结果(分页显示) this.addHistory(text); this.hideAllQueryBarView(); //输入经纬度数字时 if (this.isLonLat(text)) { this.centerAtLonLat(text); return; } //查询外部widget if (this.hasExWidget() && queryEx) { var qylist = this.queryExPOI(text); return; } //查询外部widget this.thispage = 1; this.queryText = text; this.query_location = this.viewer.xjsdk.getCenter() this.query_radius = this.viewer.camera.positionCartographic.height; //单位:米 this.queryPOI(); }, queryPOI: function () { var that = this; //查询获取数据 this.baiduPOI.queryText({ text: this.queryText, count: this.pageSize, page: (this.thispage - 1), location: this.query_location, radius: this.query_radius, success: function (result) { if (!that.isActivate) return; that.showPOIPage(result.list, result.allcount); } }); }, //===================显示查询结果处理======================== pageSize: 6, arrdata: [], counts: 0, allpage: 0, thispage: 0, showPOIPage: function (data, counts) { this.arrdata = data; this.counts = counts; if (this.counts < data.length) this.counts = data.length; this.allpage = Math.ceil(this.counts / this.pageSize); var inhtml = ""; if (this.counts == 0) { inhtml += '
    没有找到"' + this.queryText + '"相关结果
    '; } else { for (var index = 0; index < this.arrdata.length; index++) { var item = this.arrdata[index]; var startIdx = (this.thispage - 1) * this.pageSize; item.index = startIdx + (index + 1); var _id = index; var _mc; if (item.detail_info && item.detail_info.detail_url) { _mc = '' + item.name + ''; } else { _mc = item.name; } inhtml += '

    ' + item.index + '、' + _mc + '

    ' + (item.address || '') + '

    '; this.objResultData[_id] = item; }; //分页信息 var _fyhtml; if (this.allpage > 1) _fyhtml = '
    ' + this.thispage + '/' + this.allpage + '页 首页 < >
    '; else _fyhtml = ''; //底部信息 inhtml += '
    找到' + this.counts + '条结果
    ' + _fyhtml + '
    '; } $("#querybar_resultlist_view").html(inhtml); $("#querybar_resultlist_view").show(); this.showPOIArr(this.arrdata); if (this.counts == 1) { this.showDetail('0'); } }, showFirstPage: function () { this.thispage = 1; this.queryPOI(); }, showNextPage: function () { this.thispage = this.thispage + 1; if (this.thispage > this.allpage) { this.thispage = this.allpage; toastr.warning('当前已是最后一页了'); return; } this.queryPOI(); }, showPretPage: function () { this.thispage = this.thispage - 1; if (this.thispage < 1) { this.thispage = 1; toastr.warning('当前已是第一页了'); return; } this.queryPOI(); }, //点击单个结果,显示详细 objResultData: {}, showDetail: function (id) { var item = this.objResultData[id]; this.centerAt(item); }, dataSource: null, getWorkLayer: function () { if (this.dataSource == null) { this.dataSource = new Cesium.CustomDataSource(); this.viewer.dataSources.add(this.dataSource); } return this.dataSource; }, clearLayers: function () { if (this.dataSource == null) return; this.dataSource.entities.removeAll(); this.viewer.xjsdk.popup.close(); }, showPOIArr: function (arr) { var that = this; this.clearLayers(); var dataSource = this.getWorkLayer(); $(arr).each(function (i, item) { var jd = Number(item.x); var wd = Number(item.y); if (isNaN(jd) || isNaN(wd)) return; var pt = viewer.xjsdk.point2map({ x: jd, y: wd }) jd = pt.x wd = pt.y item.x = jd item.y = wd //==================构建图上目标单击后显示div================= var name; if (item.detail_info && item.detail_info.detail_url) { name = '' + item.name + ''; } else { name = item.name; } var inHtml = '
    ' + name + '
    '; var phone = $.trim(item.tel); if (phone != '') inHtml += '
    ' + phone + '
    '; var dz = $.trim(item.address); if (dz != '') inHtml += '
    ' + dz + '
    '; if (item.detail_info) { var fl = $.trim(item.detail_info.tag); if (fl != '') inHtml += '
    ' + fl + '
    '; } inHtml += '
    '; //============================================================== //添加实体 var entity = dataSource.entities.add({ name: item.name, position: Cesium.Cartesian3.fromDegrees(jd, wd), point: { color: new Cesium.Color.fromCssColorString("#3388ff"), pixelSize: 10, outlineColor: new Cesium.Color.fromCssColorString("#ffffff"), outlineWidth: 2, heightReference: Cesium.HeightReference.CLAMP_TO_GROUND, //贴地 scaleByDistance: new Cesium.NearFarScalar(1000, 1, 1000000, 0.1), disableDepthTestDistance: Number.POSITIVE_INFINITY //不被遮挡 }, label: { text: item.name, font: '20px 楷体', style: Cesium.LabelStyle.FILL_AND_OUTLINE, fillColor: Cesium.Color.AZURE, outlineColor: Cesium.Color.BLACK, outlineWidth: 2, horizontalOrigin: Cesium.HorizontalOrigin.CENTER, verticalOrigin: Cesium.VerticalOrigin.BOTTOM, pixelOffset: new Cesium.Cartesian2(0, -10),   //偏移量   heightReference: Cesium.HeightReference.CLAMP_TO_GROUND, //是地形上方的高度 distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0.0, 200000), disableDepthTestDistance: Number.POSITIVE_INFINITY //不被遮挡 }, data: item, popup: { html: inHtml, anchor: [0, -12], }, // click: function (entity) {//单击回调 // var data = entity.data; // } }); item._entity = entity; }); if (arr.length > 1) that.viewer.flyTo(that.dataSource.entities, { duration: 3 }); }, centerAt: function (item) { var entity = item._entity; if (entity == null) { toastr.warning(item.name + " 无经纬度坐标信息!"); return; } this.viewer.xjsdk.centerAt({ x: item.x, y: item.y, minz: 2500 }); var that = this; setTimeout(function () { that.viewer.xjsdk.popup.show(entity); }, 3000); }, //===================坐标定位处理======================== isLonLat: function (text) { var reg = /^-?((0|1?[0-7]?[0-9]?)(([.][0-9]*)?)|180(([.][0]*)?)),-?((0|[1-8]?[0-9]?)(([.][0-9]*)?)|90(([.][0]*)?))$/; /*定义验证表达式*/ return reg.test(text); /*进行验证*/ }, centerAtLonLat: function (text) { var arr = text.split(","); if (arr.length != 2) return; var jd = Number(arr[0]); var wd = Number(arr[1]); if (isNaN(jd) || isNaN(wd)) return; this.viewer.xjsdk.centerAt({ x: jd, y: wd, minz: 2500 }); var dataSource = this.getWorkLayer(); var inHtml = '
    坐标定位
    \
    \
    ' + jd + '
    \
    ' + wd + '
    \
    '; //添加实体 var entity = dataSource.entities.add({ name: "坐标定位", position: Cesium.Cartesian3.fromDegrees(jd, wd), point: { color: new Cesium.Color.fromCssColorString("#3388ff"), pixelSize: 10, outlineColor: new Cesium.Color.fromCssColorString("#ffffff"), outlineWidth: 2, heightReference: Cesium.HeightReference.CLAMP_TO_GROUND, //贴地 scaleByDistance: new Cesium.NearFarScalar(1000, 1, 1000000, 0.1), disableDepthTestDistance: Number.POSITIVE_INFINITY //不被遮挡 }, popup: { html: inHtml, anchor: [0, -12], } }); var that = this; setTimeout(function () { that.viewer.xjsdk.popup.show(entity); }, 3000); }, //===================历史记录相关======================== cookieName: 'querypoi_gis', arrHistory: [], showHistoryList: function () { $("#querybar_histroy_view").hide(); var lastcookie = haoutil.cookie.get(this.cookieName); //读取cookie值 if (lastcookie == null) return; this.arrHistory = eval(lastcookie); if (this.arrHistory == null || this.arrHistory.length == 0) return; var inhtml = ""; for (var index = this.arrHistory.length - 1; index >= 0; index--) { var item = this.arrHistory[index]; inhtml += "
  • " + item + "
  • "; } $("#querybar_ul_history").html(inhtml); $("#querybar_histroy_view").show(); }, clearHistory: function () { this.arrHistory = []; haoutil.cookie.del(this.cookieName); $("#querybar_ul_history").html(""); $("#querybar_histroy_view").hide(); }, //记录历史值 addHistory: function (data) { this.arrHistory = []; var lastcookie = haoutil.cookie.get(this.cookieName); //读取cookie值 if (lastcookie != null) { this.arrHistory = eval(lastcookie); } //先删除之前相同记录 this.arrHistory.remove(data); this.arrHistory.push(data); if (this.arrHistory.length > 10) this.arrHistory.splice(0, 1); lastcookie = JSON.stringify(this.arrHistory); haoutil.cookie.add(this.cookieName, lastcookie); }, //======================查询非百度poi,联合查询处理================= //外部widget是否存在或启用 exWidget: null, hasExWidget: function () { if (window["queryBarWidget"] == null) return false; else { this.exWidget = queryBarWidget; return true; } }, autoExTipList: function (text) { var that = this; this.exWidget.autoTipList(text, function () { that.autoTipList(text, false); }); }, //调用外部widget进行查询 queryExPOI: function (text) { var layer = this.getWorkLayer(); var that = this; this.exWidget.strartQueryPOI(text, layer, function () { that.strartQueryPOI(text, false); }); } }));