diff --git a/src/views/homestead/index.vue b/src/views/homestead/index.vue index 301fe308..472db9d4 100644 --- a/src/views/homestead/index.vue +++ b/src/views/homestead/index.vue @@ -2423,10 +2423,10 @@ export default { //map.removeLayer(shitu); //删除之前图层 --------------------start //属性查询删除 - map.removeLayer(nongZt[0]); - map.removeLayer(nongZt[1]); - map.removeLayer(delete_map[0]); - map.removeLayer(delete_map[1]); + //map.removeLayer(nongZt[0]); + //map.removeLayer(nongZt[1]); + //map.removeLayer(delete_map[0]); + //map.removeLayer(delete_map[1]); map.removeLayer(texiao_layer_fang); map.removeLayer(texiao_layer_di); //删除之前图层 -------------------end @@ -2524,6 +2524,101 @@ export default { rotation: undefined, // 缩放完成view视图旋转弧度 duration: 1000, // 缩放持续时间，默认不需要设置 }); + //特效动画实现 -----------------------------start + if(tach == 1 && once == 0){ + texiao_layer_fang = new ol.layer.Vector({ + source: new ol.source.Vector(), + }); + map.addLayer(texiao_layer_fang); + var center = ol.extent.getCenter(datamap); //获取边界区域的中心位置 + var circle = new ol.Feature({ + geometry: new ol.geom.Point(center), //ol.proj.transform([104, 30], 'EPSG:4326', 'EPSG:3857') //投影坐标转为地理坐标 + }); + + //var out =new ol.coordinate.Coordinate(datamap); + //var extent = ol.extent.boundingExtent(feature.getGeometry().getCoordinates()[datamap]); //获取一个坐标数组的边界，格式为[minx,miny,maxx,maxy] + //var center = ol.extent.getCenter(extent); //获取边界区域的中心位置 + //map.getView().setCenter(center); //设置当前地图的显示中心位置 + circle.setStyle( + new ol.style.Style({ + image: new ol.style.Circle({ + radius: 0, + stroke: new ol.style.Stroke({ + color: "yellow", + size: 1, + }), + }), + }) + ); + texiao_layer_fang.getSource().addFeature(circle); + + // 关键的地方在此：监听postcompose事件，在里面重新设置circle的样式 + var radius = 0; + map.on("postcompose", function () { + // 增大半径，最大20 + radius++; + radius = radius % 10; + // 设置样式 + circle.setStyle( + new ol.style.Style({ + image: new ol.style.Circle({ + radius: radius, + stroke: new ol.style.Stroke({ + color: "yellow", + size: 1, + }), + }), + }) + ); + }); + }else { + texiao_layer_di = new ol.layer.Vector({ + source: new ol.source.Vector(), + }); + map.addLayer(texiao_layer_di); + var center = ol.extent.getCenter(datamap); //获取边界区域的中心位置 + var circle = new ol.Feature({ + geometry: new ol.geom.Point(center), //ol.proj.transform([104, 30], 'EPSG:4326', 'EPSG:3857') //投影坐标转为地理坐标 + }); + + //var out =new ol.coordinate.Coordinate(datamap); + //var extent = ol.extent.boundingExtent(feature.getGeometry().getCoordinates()[datamap]); //获取一个坐标数组的边界，格式为[minx,miny,maxx,maxy] + //var center = ol.extent.getCenter(extent); //获取边界区域的中心位置 + //map.getView().setCenter(center); //设置当前地图的显示中心位置 + circle.setStyle( + new ol.style.Style({ + image: new ol.style.Circle({ + radius: 0, + stroke: new ol.style.Stroke({ + color: "yellow", + size: 1, + }), + }), + }) + ); + texiao_layer_di.getSource().addFeature(circle); + + // 关键的地方在此：监听postcompose事件，在里面重新设置circle的样式 + var radius = 0; + map.on("postcompose", function () { + // 增大半径，最大20 + radius++; + radius = radius % 10; + // 设置样式 + circle.setStyle( + new ol.style.Style({ + image: new ol.style.Circle({ + radius: radius, + stroke: new ol.style.Stroke({ + color: "yellow", + size: 1, + }), + }), + }) + ); + }); + } + //特效动画实现 -----------------------------end } else if (tach == 1) { once = once + 1; } else { @@ -2605,7 +2700,7 @@ export default { map.removeLayer(texiao_layer_fang); map.removeLayer(texiao_layer_di); var cun = _this.villageDataObj.deptName; - + _this.homesteadListShrink(); //删除之前加载的图层 //map.removeLayer(dishitu); //map.removeLayer(cunshitu); @@ -2761,6 +2856,7 @@ export default { //删除之前加载的图层 map.removeLayer(texiao_layer_di); map.removeLayer(texiao_layer_fang); + _this.homesteadListShrink(); var cun = _this.villageDataObj.deptName; //删除之前加载的图层 //map.removeLayer(dishitu); @@ -2811,26 +2907,32 @@ export default { }) .then((data) => { //关联查询农地信息 ----------start - // document.getElementById("info").innerHTML = ""; - // var select_di = (document.getElementById("info").innerHTML = - // data.features[0].properties); - // _this.hasTable = true; - // _this.hasDateStatus = 0; - // let obj = {}; - // //let trs = $("#info").find("tr:eq(1)"); - // obj.XH = select_di.XH; //序号 - // obj.CM = select_di.CM; //村名 - // obj.CBRMC = select_di.CBRMC; //承包人名称 - // obj.SYRMC = select_di.SYRMC; //使用人名称 - // obj.NYDLX = select_di.NYDLX; //农用地类型 - // obj.MJ = select_di.MJ; //面积 - // obj.XZQK = select_di.XZQK; //现状情况 - // obj.LZHTJZRQ = select_di.LZHTJZRQ; //流转合同截止时间 - // obj.LZSYNX = select_di.LZSYNX; //流转剩余年限 - // obj.SFYLZYX = select_di.SFYLZYX; //是否流转意向 - // obj.CDM = select_di.CDM; //村代码 - // obj.org_code = select_di.org_code; //行政区化代码 - // _this.hasData = obj; + // document.getElementById("info").innerHTML = ""; + // var select_di = (document.getElementById("info").innerHTML = + // data.features[0].properties); + // _this.farmhouseStatus = 1; + // let obj = {}; + // let zjId = data.features[0].id; + // let zjIdNum = zjId.replace("t_geo_hc_land.", ""); + // obj.id = zjIdNum; // 主键id + // obj.xh = select_di.XH; //序号 + // obj.cm = select_di.CM; //村名 + // obj.cbrmc = select_di.CBRMC; //承包人名称 + // obj.syrmc = select_di.SYRMC; //使用人名称 + // obj.nydlx = select_di.NYDLX; //农用地类型 + // obj.mj = select_di.MJ; //面积 + // obj.xzqk = select_di.XZQK; //现状情况 + // obj.lzhtjzrq = select_di.LZHTJZRQ; //流转合同截止时间 + // obj.lzsynx = select_di.LZSYNX; //流转剩余年限 + // obj.sfylzyx = select_di.SFYLZYX; //是否流转意向 + // obj.cdm = select_di.CDM; //村代码 + // obj.orgCode = select_di.org_code; //行政区化代码 + // obj.frontland = select_di.frontland; //图片前 + // obj.behindland = select_di.behindland; //图片后 + // // // _this.nydlxOptionsValue = trs.find("td").eq(5).text(); //农用地类型 + // let cloneObj = JSON.parse(JSON.stringify(obj)); + // _this.landInfoList = cloneObj; + // _this.landInfoLookList = obj; //关联查询农地信息 ----------end //获取坐标定位开始----------start //var datamap = data.bbox;