| | |
| | | <div id="sousuo" class="sousuo"> |
| | | <!-- 搜索框 --> |
| | | <div class="ssk" v-show="ssk.show"> |
| | | <span |
| | | @click="ssjmxs" |
| | | style="float: left; height: 100%; width: 80%; overflow: hidden" |
| | | ><i class="el-icon-search" style="padding: 0px 15px 0px 20px"></i |
| | | >{{ syssval }}</span |
| | | > |
| | | <span |
| | | v-show="syssval !== '请输入关键词搜索地图'" |
| | | @click="clearval" |
| | | style="float: right; height: 100%; width: 20%" |
| | | ><i class="el-icon-circle-close"></i |
| | | ></span> |
| | | <span |
| | | v-show="syssval !== '请输入关键词搜索地图'" |
| | | style=" |
| | | <span @click="ssjmxs" style="float: left; height: 100%; width: 80%; overflow: hidden"><i class="el-icon-search" |
| | | style="padding: 0px 15px 0px 20px"></i>{{ syssval }}</span> |
| | | <span v-show="syssval !== '请输入关键词搜索地图'" @click="clearval" style="float: right; height: 100%; width: 20%"><i |
| | | class="el-icon-circle-close"></i></span> |
| | | <span v-show="syssval !== '请输入关键词搜索地图'" style=" |
| | | float: right; |
| | | height: 100%; |
| | | width: 10%; |
| | | position: absolute; |
| | | top: -1px; |
| | | right: -3px; |
| | | " |
| | | > |
| | | <img |
| | | src="@/assets/img/navigation/addf.png" |
| | | style="width: 20px" |
| | | @click.stop="AddFavorite" |
| | | /> |
| | | "> |
| | | <img src="@/assets/img/navigation/addf.png" style="width: 20px" @click.stop="AddFavorite" /> |
| | | </span> |
| | | <span |
| | | v-show="syssval == '请输入关键词搜索地图'" |
| | | style="float: right; height: 100%; width: 10%" |
| | | > |
| | | <img |
| | | src="@/assets/img/navigation/addf.png" |
| | | style="width: 20px" |
| | | @click.stop="showAddFavorite" |
| | | /> |
| | | <span v-show="syssval == '请输入关键词搜索地图'" style="float: right; height: 100%; width: 10%"> |
| | | <img src="@/assets/img/navigation/addf.png" style="width: 20px" @click.stop="showAddFavorite" /> |
| | | </span> |
| | | </div> |
| | | <!-- 搜索界面 --> |
| | |
| | | </div> |
| | | <!-- 搜索框 --> |
| | | <div style="margin: 0.1rem 0"> |
| | | <el-input |
| | | placeholder="输入关键字搜索地图" |
| | | autofocus |
| | | v-model="poi_text" |
| | | @input="changeInput" |
| | | clearable |
| | | > |
| | | <el-input placeholder="输入关键字搜索地图" autofocus v-model="poi_text" @input="changeInput" clearable> |
| | | <el-select v-model="select" slot="prepend" placeholder="请选择"> |
| | | <el-option |
| | | v-for="(item, index) in options" |
| | | :key="index" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | ></el-option> |
| | | <el-option v-for="(item, index) in options" :key="index" :label="item.label" :value="item.value"></el-option> |
| | | </el-select> |
| | | <el-button |
| | | slot="append" |
| | | icon="el-icon-search" |
| | | @click="search" |
| | | ></el-button> |
| | | <el-button slot="append" icon="el-icon-search" @click="search"></el-button> |
| | | </el-input> |
| | | </div> |
| | | <!-- 结果显示 --> |
| | | <div v-if="total != 0"> |
| | | <div class="ssjg" v-show="ssjgxs"> |
| | | <div |
| | | class="everyinfo" |
| | | v-for="(item, index) in poiList" |
| | | :key="index" |
| | | @click="flyTo(item)" |
| | | > |
| | | <div class="everyinfo" v-for="(item, index) in poiList" :key="index" @click="flyTo(item)"> |
| | | <div style="margin: 0.05rem 0"> |
| | | <i class="el-icon-map-location"></i>{{ item.name }} |
| | | </div> |
| | |
| | | <span>电话:{{ item.telphone ? item.telphone : "暂无联系方式" }}</span> --> |
| | | <!-- <span>区域:{{ item.area ? item.area : "暂无区域信息" }}</span> --> |
| | | <!-- <br /> --> |
| | | <span |
| | | >地址:{{ item.address ? item.address : "暂无详细地址" }}</span |
| | | > |
| | | <span>地址:{{ item.address ? item.address : "暂无详细地址" }}</span> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | height: 100%; |
| | | top: 0; |
| | | background-color: #f3f3f3; |
| | | z-index: 99999; |
| | | z-index: 99; |
| | | } |
| | | |
| | | .el-select { |
| | | width: 80px; |
| | | } |
| | | |
| | | |
| | | .el-scrollbar .hover { |
| | | background: none; |
| | | } |
| | | |
| | | |
| | | /* 每条搜索结果 */ |
| | | .everyinfo { |
| | |
| | | import axios from "axios"; |
| | | import store from "@/utils/store2.js"; |
| | | import common from "@/components/common"; |
| | | |
| | | import { createPointMarker, flyToPoint } from '@/utils/map2.js' |
| | | window.flyPoint = null; |
| | | window.flyLine = null; |
| | | let Allresults = []; |
| | |
| | | flyTo(item) { |
| | | this.ssjm = false; |
| | | this.syssval = item.name; |
| | | let that = this; |
| | | //飞行定位 |
| | | flyToPoint([item.lng, item.lat]) |
| | | //创建点位 |
| | | let layer = createPointMarker([item.lng, item.lat], item); |
| | | window.map.addLayer(layer) |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | // let that = this; |
| | | // let degrees = item.location.split(','); |
| | | // let degrees = [item.location.lng, item.location.lat]; |
| | | let degrees = [item.lng, item.lat]; |
| | | window.flyPoint && Viewer.entities.remove(window.flyPoint); |
| | | window.flyLine && sgworld.Creator.DeleteObject(window.flyLine); |
| | | sgworld.Navigate.flyToPointsInterest({ |
| | | destination: Cesium.Cartesian3.fromDegrees( |
| | | degrees[0], |
| | | degrees[1], |
| | | 1000 |
| | | ), |
| | | }); |
| | | // let degrees = [item.lng, item.lat]; |
| | | // window.flyPoint && Viewer.entities.remove(window.flyPoint); |
| | | // window.flyLine && sgworld.Creator.DeleteObject(window.flyLine); |
| | | // sgworld.Navigate.flyToPointsInterest({ |
| | | // destination: Cesium.Cartesian3.fromDegrees( |
| | | // degrees[0], |
| | | // degrees[1], |
| | | // 1000 |
| | | // ), |
| | | // }); |
| | | // 添加点位 |
| | | window.flyPoint = Viewer.entities.add({ |
| | | position: Cesium.Cartesian3.fromDegrees(degrees[0], degrees[1]), |
| | | billboard: { |
| | | verticalOrigin: Cesium.VerticalOrigin.BOTTOM, |
| | | scale: 1, |
| | | image: window.SmartEarthRootUrl + "/Workers/image/mark1.png", |
| | | heightReference: 1, |
| | | disableDepthTestDistance: Number.POSITIVE_INFINITY, |
| | | }, |
| | | properties: item, |
| | | }); |
| | | // window.flyPoint = Viewer.entities.add({ |
| | | // position: Cesium.Cartesian3.fromDegrees(degrees[0], degrees[1]), |
| | | // billboard: { |
| | | // verticalOrigin: Cesium.VerticalOrigin.BOTTOM, |
| | | // scale: 1, |
| | | // image: window.SmartEarthRootUrl + "/Workers/image/mark1.png", |
| | | // heightReference: 1, |
| | | // disableDepthTestDistance: Number.POSITIVE_INFINITY, |
| | | // }, |
| | | // properties: item, |
| | | // }); |
| | | // 如果是地块,添加范围线 |
| | | if (item.type == "大兴用地") { |
| | | axios |
| | | .get( |
| | | window.gisBaseUrl + |
| | | "yzxncsApi/geowinmap_xncs/ds?r=0.9158559377752831&serviceproviderid=map.vectorserviceprovider&serviceid=queryfeature&featcls=225%25E8%258C%2583%25E5%259B%25B4%25E5%2588%2586%25E5%258C%25BA%25E8%25A7%2584%25E5%2588%2592.geojson&lng=" + |
| | | degrees[0] + |
| | | "&lat=" + |
| | | degrees[1] + |
| | | "&geom=true&requesttype=json" |
| | | ) |
| | | .then((response) => { |
| | | let center = { lon: 0, lat: 0 }; |
| | | let polygon = that.read(response.data.geometry); |
| | | if (polygon.length > 0) { |
| | | var geometry = []; |
| | | let points = polygon[0].split(","); |
| | | for (let i = 0; i < points.length; i++) { |
| | | let point = points[i].replace(/^\s+|\s+$/g, "").split(" "); |
| | | center.lon += parseFloat(point[0]) / points.length; |
| | | center.lat += parseFloat(point[1]) / points.length; |
| | | geometry.push({ |
| | | x: parseFloat(point[0]), |
| | | y: parseFloat(point[1]), |
| | | z: 0, |
| | | }); |
| | | } |
| | | window.flyLine = sgworld.Creator.createPolyline( |
| | | geometry, |
| | | "#ff0000", |
| | | 1, |
| | | 0, |
| | | "线" |
| | | ); |
| | | } |
| | | }); |
| | | } |
| | | // if (item.type == "大兴用地") { |
| | | // axios |
| | | // .get( |
| | | // window.gisBaseUrl + |
| | | // "yzxncsApi/geowinmap_xncs/ds?r=0.9158559377752831&serviceproviderid=map.vectorserviceprovider&serviceid=queryfeature&featcls=225%25E8%258C%2583%25E5%259B%25B4%25E5%2588%2586%25E5%258C%25BA%25E8%25A7%2584%25E5%2588%2592.geojson&lng=" + |
| | | // degrees[0] + |
| | | // "&lat=" + |
| | | // degrees[1] + |
| | | // "&geom=true&requesttype=json" |
| | | // ) |
| | | // .then((response) => { |
| | | // let center = { lon: 0, lat: 0 }; |
| | | // let polygon = that.read(response.data.geometry); |
| | | // if (polygon.length > 0) { |
| | | // var geometry = []; |
| | | // let points = polygon[0].split(","); |
| | | // for (let i = 0; i < points.length; i++) { |
| | | // let point = points[i].replace(/^\s+|\s+$/g, "").split(" "); |
| | | // center.lon += parseFloat(point[0]) / points.length; |
| | | // center.lat += parseFloat(point[1]) / points.length; |
| | | // geometry.push({ |
| | | // x: parseFloat(point[0]), |
| | | // y: parseFloat(point[1]), |
| | | // z: 0, |
| | | // }); |
| | | // } |
| | | // window.flyLine = sgworld.Creator.createPolyline( |
| | | // geometry, |
| | | // "#ff0000", |
| | | // 1, |
| | | // 0, |
| | | // "线" |
| | | // ); |
| | | // } |
| | | // }); |
| | | // } |
| | | }, |
| | | AddFavorite() { |
| | | let posi = sgworld.Viewer.camera.position; |