gisviewer-vue3-arcgis/lib/src/gis-map/utils/signal-control-area/cross-renderer.js

在应用中引入私服的包， 项目根目录下 新建文件 .npmrc 在 .npmrc 中对包源进行配置：

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const h=require("@arcgis/core/geometry"),y=require("@arcgis/core/Graphic"),p=require("@arcgis/core/layers/GraphicsLayer");class f{constructor(e){this.crossGraphicSymbol={type:"cim",data:{type:"CIMSymbolReference",primitiveOverrides:[{type:"CIMPrimitiveOverride",primitiveName:"textGraphic",propertyName:"TextString",valueExpressionInfo:{type:"CIMExpressionInfo",title:"Custom",expression:'Replace($feature.name, "与", "/") + "  " + $feature.signalId',returnType:"Default"}}],symbol:{type:"CIMPointSymbol",symbolLayers:[{type:"CIMVectorMarker",size:32,colorLocked:!0,anchorPointUnits:"Relative",frame:{xmin:-16,ymin:-16,xmax:16,ymax:16},markerGraphics:[{type:"CIMMarkerGraphic",primitiveName:"textGraphic",geometry:{x:0,y:0},symbol:{type:"CIMTextSymbol",height:12,horizontalAlignment:"Center",offsetX:0,offsetY:18,haloSize:1,haloSymbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:[255,255,255,255]}]},symbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:[0,0,0,255]}]},verticalAlignment:"Center"},textString:""}],scaleSymbolsProportionally:!0,respectFrame:!0},{type:"CIMPictureMarker",enable:!0,anchorPoint:{x:0,y:0},anchorPointUnits:"Relative",size:20,rotateClockwise:!0,textureFilter:"Picture",url:"/GisViewerAssets/Images/cross/gis_xhj_blue.png"}]}}},this.locations=[],this.clusteredLocations=[],this.filteredLocations=[],this.currentShowMode="scatter",this.symbolScale=5e3,this.oldScale=0,this.clusterRadius=120,this.minClusterPoints=2,this.maxClusterSymbolSize=50,this.minClusterSymbolSize=25,this.view=e,this.crossLayer=new p,this.view.map.add(this.crossLayer),this.oldScale=e.scale}async addCrosses(e){e.forEach(t=>{t.signals.forEach(i=>{i.longitude&&i.latitude&&!isNaN(i.longitude)&&!isNaN(i.latitude)&&this.locations.push({id:i.id,x:i.longitude,y:i.latitude,visited:!1,filtered:!1,clusterId:void 0,properties:{...i,districtId:t.id,districtName:t.name,subDistrictId:"",subDistrictName:""}})}),t.subDistricts.forEach(i=>{i.signals.forEach(s=>{s.longitude&&s.latitude&&!isNaN(s.longitude)&&!isNaN(s.latitude)&&this.locations.push({id:s.id,x:s.longitude,y:s.latitude,visited:!1,filtered:!1,clusterId:void 0,properties:{...s,districtId:t.id,districtName:t.name,subDistrictId:i.id,subDistrictName:i.name}})})})}),this.zoomWatchHandle=this.view.watch("stationary",()=>{if(this.view.stationary!==!1){if(this.currentShowMode==="scatter")(this.oldScale<this.symbolScale&&this.view.scale>=this.symbolScale||this.oldScale>=this.symbolScale&&this.view.scale<this.symbolScale)&&this.updateScatterSymbol(),this.oldScale=this.view.scale;else if(this.currentShowMode==="cluster"){this.locationToScreen(),console.time("cluster");const t=this.doPixelCluster(this.clusterRadius);console.timeEnd("cluster"),this.showClusterResult(t)}}})}clearCrosses(){var e;this.crossLayer.removeAll(),this.locations=[],this.clusteredLocations=[],(e=this.zoomWatchHandle)==null||e.remove()}updateScatterSymbol(){this.crossLayer.graphics.forEach(e=>{e.symbol=this.getCrossSymbol(e.attributes)})}locationToScreen(){this.clusteredLocations=[],this.locations.forEach(e=>{const t=this.view.toScreen(new h.Point({x:e.x,y:e.y}));e.filtered===!1&&t.x>0&&t.y>0&&(e.properties.screenX=t.x,e.properties.screenY=t.y,e.visited=!1,e.clusterId=void 0,this.clusteredLocations.push(e))})}showCluster(){this.crossLayer.removeAll(),this.currentShowMode="cluster",this.locationToScreen();const e=this.doPixelCluster(this.clusterRadius);this.showClusterResult(e)}showScatter(){this.crossLayer.removeAll(),this.currentShowMode="scatter";const e=[];this.locations.forEach(t=>{if(!t.filtered){const i=new y({geometry:{type:"point",longitude:t.x,latitude:t.y},symbol:this.getCrossSymbol(t.properties),attributes:t.properties,popupTemplate:{title:"{name}信号机",content:[{type:"fields",fieldInfos:[{fieldName:"signalId",label:"信号机编号"},{fieldName:"nodeId",label:"路口编号"},{fieldName:"districtName",label:"区控名称"},{fieldName:"subDistrictName",label:"子区名称"}]}]}});e.push(i)}}),this.crossLayer.addMany(e)}hideCrosses(){this.crossLayer.removeAll()}filter(e){this.locations.forEach(t=>{if(e.type==="district")t.filtered=t.properties.districtId!==e.id;else if(e.type==="subDistrict")t.filtered=t.properties.subDistrictId!==e.id;else if(e.type==="signal"&&(t.filtered=t.id!==e.id,t.filtered))return t.properties})}resetFilter(){this.locations.forEach(e=>{e.filtered=!1}),this.currentShowMode==="scatter"?this.showScatter():this.currentShowMode==="cluster"&&this.showCluster()}getCrossSymbol(e){if(this.view.scale>this.symbolScale)return e.isKey?{type:"picture-marker",url:"/GisViewerAssets/Images/icon_star.png",width:"20px",height:"20px"}:{type:"simple-marker",style:"circle",color:[5,116,255,.8],size:8,outline:{color:"white",width:0}};{const t=e.isKey?"/GisViewerAssets/Images/cross/gis_gjxklk_orange.png":"/GisViewerAssets/Images/cross/gis_xhj_blue.png";return{type:"cim",data:{type:"CIMSymbolReference",primitiveOverrides:[{type:"CIMPrimitiveOverride",primitiveName:"textGraphic",propertyName:"TextString",valueExpressionInfo:{type:"CIMExpressionInfo",title:"Custom",expression:'Replace($feature.name, "与", "/") + "  " + $feature.signalId',returnType:"Default"}}],symbol:{type:"CIMPointSymbol",symbolLayers:[{type:"CIMVectorMarker",size:32,colorLocked:!0,anchorPointUnits:"Relative",frame:{xmin:-16,ymin:-16,xmax:16,ymax:16},markerGraphics:[{type:"CIMMarkerGraphic",primitiveName:"textGraphic",geometry:{x:0,y:0},symbol:{type:"CIMTextSymbol",height:12,horizontalAlignment:"Center",offsetX:0,offsetY:20,haloSize:1,haloSymbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:[255,255,255,255]}]},symbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:[0,0,0,255]}]},verticalAlignment:"Center"},textString:""}],scaleSymbolsProportionally:!0,respectFrame:!0},{type:"CIMPictureMarker",enable:!0,anchorPoint:{x:0,y:0},anchorPointUnits:"Relative",size:20,rotateClockwise:!0,textureFilter:"Picture",url:t}]}}}}}getNeighbors(e,t){return this.clusteredLocations.filter(i=>i.id===e.id||i.visited?!1:this.getDistance(e,i)<=t)}getDistance(e,t){return Math.sqrt(Math.pow(e.properties.screenX-t.properties.screenX,2)+Math.pow(e.properties.screenY-t.properties.screenY,2))}createClusters(){const e={},t=[];for(const s of this.clusteredLocations)s.clusterId===void 0||s.clusterId===-1?t.push(s):(e[s.clusterId]||(e[s.clusterId]=[]),e[s.clusterId].push(s));const i=Object.keys(e).map((s,r)=>{const o=e[Number(s)],a=o.length,l=o.reduce((n,u)=>n+u.x,0),c=o.reduce((n,u)=>n+u.y,0),m=l/a,d=c/a;return{id:Number(s),items:o,count:a,center:{x:m,y:d}}});return t.length>0&&i.push({id:-1,items:t,count:t.length,center:null}),i}doPixelCluster(e){let t=0;for(let i=0;i<this.clusteredLocations.length;i++){const s=this.clusteredLocations[i];if(s.visited)continue;s.visited=!0;const r=this.getNeighbors(s,e);r.length<this.minClusterPoints?s.clusterId=-1:(r.forEach(o=>{o.visited=!0,o.clusterId=t}),s.clusterId=t,t++)}return this.createClusters()}showClusterResult(e){this.crossLayer.removeAll();let t=Number.MIN_VALUE,i=Number.MAX_VALUE;e.forEach(s=>{s.count>1&&(i=Math.min(i,s.count),t=Math.max(t,s.count))}),e.forEach(s=>{if(s.id!==-1){let r=i===t?(this.maxClusterSymbolSize+this.minClusterSymbolSize)/2:this.minClusterSymbolSize+(s.count-i)/(t-i)*(this.maxClusterSymbolSize-this.minClusterSymbolSize);r*=.75;const l=(s.count.toString().length*8+6)/2,c=new y({geometry:new h.Point({x:s.center.x,y:s.center.y}),attributes:{count:s.count},symbol:{type:"cim",data:{type:"CIMSymbolReference",primitiveOverrides:[{type:"CIMPrimitiveOverride",primitiveName:"textGraphic",propertyName:"TextString",valueExpressionInfo:{type:"CIMExpressionInfo",title:"Custom",expression:"$feature.count",returnType:"Default"}}],symbol:{type:"CIMPointSymbol",symbolLayers:[{type:"CIMVectorMarker",size:r,colorLocked:!0,anchorPointUnits:"Relative",frame:{xmin:-16,ymin:-16,xmax:16,ymax:16},markerGraphics:[{type:"CIMMarkerGraphic",geometry:{rings:[[[-l,40],[l,40],[l,20],[-l,20],[-l,40]]]},symbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:[2,72,200,255]},{type:"CIMSolidStroke",enable:!0,width:5,color:[2,72,200,128]}]}},{type:"CIMMarkerGraphic",primitiveName:"textGraphic",geometry:{x:0,y:0},symbol:{type:"CIMTextSymbol",height:16,horizontalAlignment:"Center",offsetX:0,offsetY:30,symbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:[255,255,255,255]}]},verticalAlignment:"Center"},textString:""}],scaleSymbolsProportionally:!0,respectFrame:!0},{type:"CIMPictureMarker",enable:!0,anchorPoint:{x:0,y:0},anchorPointUnits:"Relative",size:r,rotateClockwise:!0,textureFilter:"Picture",url:"/GisViewerAssets/Images/cross/gis_xhj_blue.png"}]}}}});this.crossLayer.add(c)}else s.items.forEach(r=>{const o=new y({geometry:new h.Point({x:r.x,y:r.y}),attributes:{...r,...r.properties,type:"clusterPoint",id:r.id},symbol:this.crossGraphicSymbol,popupTemplate:{title:"{name}信号机",content:[{type:"fields",fieldInfos:[{fieldName:"signalId",label:"信号机编号"},{fieldName:"nodeId",label:"路口编号"},{fieldName:"districtName",label:"区控名称"},{fieldName:"subDistrictName",label:"子区名称"}]}]}});this.crossLayer.add(o)})})}}exports.default=f;