@arcgis/core/views/3d/analysis/DirectLineMeasurement/DirectLineMeasurementVisualization.js

ArcGIS Maps SDK for JavaScript: A complete 2D and 3D mapping and data visualization API

/*
All material copyright ESRI, All Rights Reserved, unless otherwise specified.
See https://js.arcgis.com/4.33/esri/copyright.txt for details.
*/
import{_ as e}from"../../../../chunks/tslib.es6.js";import"../../../../intl.js";import t from"../../../../core/Accessor.js";import{unitRGBAFromColor as i,multiplyOpacityToUnitRGBA as s,getContrast as n,BrightnessThreshold as o,multiplyOpacity as r}from"../../../../core/colorUtils.js";import"../../../../core/has.js";import{nextHighestPowerOfTen as l,deg2rad as a}from"../../../../core/mathUtils.js";import{destroyMaybe as c}from"../../../../core/maybe.js";import{formatDecimal as d,formatImperialVerticalLength as h,formatImperialLength as u,formatMetricVerticalLength as m,formatMetricLength as g}from"../../../../core/quantityFormatUtils.js";import{toUnit as p}from"../../../../core/quantityUtils.js";import{watch as _,syncAndInitial as v,initial as b}from"../../../../core/reactiveUtils.js";import{createRenderScreenPointArray3 as L,createRenderScreenPointArray as w}from"../../../../core/screenUtils.js";import{adaptiveImperialLengthUnit as S,convertUnit as f}from"../../../../core/unitUtils.js";import{property as y}from"../../../../core/accessorSupport/decorators/property.js";import"../../../../core/Logger.js";import"../../../../core/RandomLCG.js";import{subclass as A}from"../../../../core/accessorSupport/decorators/subclass.js";import{dot as E}from"../../../../core/libs/gl-matrix-2/math/vec2.js";import{g as V,f as P}from"../../../../chunks/vec32.js";import{create as z}from"../../../../core/libs/gl-matrix-2/factories/vec3f64.js";import{MeasurementMode as j}from"../interfaces.js";import{ViewMode as M,VisualElementOrientation as C}from"./interfaces.js";import{renderScreenSpaceTangent as O}from"../../interactive/support/viewUtils.js";import{LabelVisualElement as D,mirrorPosition as x}from"../../interactive/visualElements/LabelVisualElement.js";import{LineVisualElement as G}from"../../interactive/visualElements/LineVisualElement.js";import{MeasurementArrowVisualElement as H}from"../../interactive/visualElements/MeasurementArrowVisualElement.js";import{RightAngleQuadVisualElement as T}from"../../interactive/visualElements/RightAngleQuadVisualElement.js";import{GeodesicSegment as k,EuclideanSegment as U}from"../../interactive/visualElements/support/Segment.js";import{RenderOccludedFlag as R}from"../../webgl-engine/lib/Material.js";import{createStipplePatternSimple as F}from"../../webgl-engine/materials/lineStippleUtils.js";import{geodesicDistanceThreshold as Q}from"../../../support/geodesicMeasurementUtils.js";import{onLocaleChange as q}from"../../../../intl/locale.js";import{fetchMessageBundle as B}from"../../../../intl/messages.js";let W=class extends t{get _parameters(){const e=this.view.effectiveTheme,{accentColor:t,textColor:l}=e,a=i(t),c=s(t,.75),d=i(n(t)),h=n(l,o.Low);return{accentColor:a,contrastColor:d,translucentAccentColor:c,triangleLineWidth:3,geodesicProjectionLineWidth:2,guideLineWidth:2,guideStippleLengthPixels:3,directLabelFontSize:16,horizontalLabelFontSize:12,verticalLabelFontSize:12,textColor:l,textBackgroundColor:r(h,.6),textCalloutColor:r(h,.5)}}get visible(){return this.analysisView.visible}get viewMode(){const{elevationAlignedStartPoint:e,elevationAlignedEndPoint:t}=this.analysisView;if(null==e||null==t||e.equals(t))return M.None;const i=this.analysisView.result;if(null==i)return M.Direct;if("geodesic"===this.actualVisualizedMeasurement)return this._requiresGeodesicGuideAt(this._startPosition)||this._requiresGeodesicGuideAt(this._endPosition)?M.ProjectedGeodesic:M.Direct;const{verticalDistance:s,horizontalDistance:n}=i,o=p(s,"meters").value,r=p(n,"meters").value;return Math.min(o/r,r/o)<this.triangleCollapseRatioThreshold?M.Direct:M.Triangle}get actualVisualizedMeasurement(){const{measurementMode:e,result:t}=this.analysisView;switch(e){case j.Auto:return null!=t&&p(t.horizontalDistance,"meters").value>Q?"geodesic":"euclidean";case j.Euclidean:return"euclidean";case j.Geodesic:return"geodesic"}}get allowVisualElementsOrientationChange(){return null==this._triangleOrientationOverride}set allowVisualElementsOrientationChange(e){null==this._triangleOrientationOverride!==e&&(null==this._triangleOrientationOverride?this._triangleOrientationOverride=this._actualVisualElementsOrientation:this._triangleOrientationOverride=null)}get labels(){return"geodesic"===this.actualVisualizedMeasurement?{direct:null,horizontal:this._segmentLabel,vertical:this._verticalLabel}:{direct:this._segmentLabel,horizontal:this._horizontalLabel,vertical:this._verticalLabel}}constructor(e){super(e),this._segmentVisualElement=null,this._triangleVisualElement=null,this._rightAngleQuad=null,this._projectedGeodesicLine=null,this._geodesicStartHint=null,this._geodesicEndHint=null,this._segmentLabel=null,this._verticalLabel=null,this._horizontalLabel=null,this._startPosition=z(),this._endPosition=z(),this._cornerPosition=z(),this._startPositionAtSeaLevel=z(),this._endPositionAtSeaLevel=z(),this._triangleOrientationOverride=null,this.messages=null,this.loadingMessages=!0,this.visualElementOrientation=C.Auto,this.triangleCollapseRatioThreshold=.03}initialize(){const e={attached:!0,view:this.view,isDecoration:!0},{guideLineWidth:t,guideStippleLengthPixels:i,triangleLineWidth:s,geodesicProjectionLineWidth:n,directLabelFontSize:o,verticalLabelFontSize:r,horizontalLabelFontSize:l}=this._parameters;this._segmentVisualElement=new H({...e,geometry:null,renderOccluded:R.OccludeAndTransparent}),this._triangleVisualElement=new G({...e,width:s,renderOccluded:R.OccludeAndTransparent}),this._rightAngleQuad=new T({...e,renderOccluded:R.OccludeAndTransparent});const a={...e,polygonOffset:!0,renderOccluded:R.OccludeAndTransparent};this._projectedGeodesicLine=new G({...a,width:n,stipplePattern:F(i)}),this._geodesicStartHint=new G({...a,width:t,stipplePattern:F(i)}),this._geodesicEndHint=new G({...a,width:t,stipplePattern:F(i)}),this._segmentLabel=new D({...e,fontSize:o}),this._verticalLabel=new D({...e,fontSize:r}),this._horizontalLabel=new D({...e,fontSize:l}),this.addHandles([_((()=>{const{elevationAlignedStartPoint:e,elevationAlignedEndPoint:t}=this.analysisView,i=this.view;return{view:i,camera:i.state.camera,viewMode:this.viewMode,elevationAlignedStartPoint:e,elevationAlignedEndPoint:t,orientation:this._actualVisualElementsOrientation,visualizedMeasurement:this.actualVisualizedMeasurement,stripeLength:this._measurementArrowStripeLength}}),(e=>this._updateGeometryAndViewMode(e)),v),_((()=>({visible:this.visible,viewMode:this.viewMode})),(e=>this._updateVisualElementVisibility(e)),v),_((()=>({text:this._labelsText,visualizedMeasurement:this.actualVisualizedMeasurement})),(e=>this._updateLabelText(e)),v),_((()=>({visible:this.visible,viewMode:this.viewMode})),(e=>this._updateLabelVisibility(e)),v),_((()=>this._measurementArrowStripeLength),(e=>this._updateSegmentStripeLength(e)),v),q((async()=>this._updateMessageBundle())),_((()=>this._parameters),(({textBackgroundColor:e,textCalloutColor:t,textColor:i,translucentAccentColor:s,accentColor:n,contrastColor:o})=>{const{_segmentLabel:r,_verticalLabel:l,_horizontalLabel:a,_triangleVisualElement:c,_rightAngleQuad:d,_projectedGeodesicLine:h,_geodesicStartHint:u,_geodesicEndHint:m,_segmentVisualElement:g}=this;r.backgroundColor=e,r.calloutColor=t,r.textColor=i,l.backgroundColor=e,l.calloutColor=t,l.textColor=i,a.backgroundColor=e,a.calloutColor=t,a.textColor=i,c.color=s,d.color=s,h.color=s,u.color=s,m.color=s,g.color=n,g.contrastColor=o}),b)]),this._updateMessageBundle()}destroy(){this._segmentVisualElement=c(this._segmentVisualElement),this._triangleVisualElement=c(this._triangleVisualElement),this._rightAngleQuad=c(this._rightAngleQuad),this._projectedGeodesicLine=c(this._projectedGeodesicLine),this._geodesicStartHint=c(this._geodesicStartHint),this._geodesicEndHint=c(this._geodesicEndHint),this._segmentLabel=c(this._segmentLabel),this._verticalLabel=c(this._verticalLabel),this._horizontalLabel=c(this._horizontalLabel),this.set("view",null)}_updateVisualElementVisibility({visible:e,viewMode:t}){if(this._segmentVisualElement.visible=!1,this._triangleVisualElement.visible=!1,this._rightAngleQuad.visible=!1,this._projectedGeodesicLine.visible=!1,this._geodesicStartHint.visible=!1,this._geodesicEndHint.visible=!1,e)switch(t){case M.None:break;case M.Direct:this._segmentVisualElement.visible=!0;break;case M.Triangle:this._segmentVisualElement.visible=!0,this._triangleVisualElement.visible=!0,this._rightAngleQuad.visible=!0;break;case M.ProjectedGeodesic:this._segmentVisualElement.visible=!0,this._projectedGeodesicLine.visible=!0,this._geodesicStartHint.visible=!0,this._geodesicEndHint.visible=!0}}_updateGeometryAndViewMode({view:e,camera:t,viewMode:i,elevationAlignedStartPoint:s,elevationAlignedEndPoint:n,orientation:o,visualizedMeasurement:r,stripeLength:l}){const a=e.renderCoordsHelper;if(null==a||null==s||null==n||s.equals(n))return;let c=this._startPosition,d=this._endPosition;a.toRenderCoords(s,c),a.toRenderCoords(n,d);const h=o===C.AboveSegment?1:-1,u=h*(a.getAltitude(d)-a.getAltitude(c));u<0&&(c=this._endPosition,d=this._startPosition);const m="geodesic"===r?new k(this._startPosition,this._endPosition,a.spatialReference):new U(this._startPosition,this._endPosition);switch(this._segmentVisualElement.geometry=m,this._updateSegmentStripeLength(l),i){case M.Direct:this._updateSegment(m,o);break;case M.Triangle:this._updateSegmentAndTriangle({view:e,camera:t,segment:m,orientation:o,startPosition:c,endPosition:d,deltaSign:h,altitudeDelta:u});break;case M.ProjectedGeodesic:this._updateSegmentAndProjection({view:e,orientation:o,startPosition:c,endPosition:d})}}_updateSegment(e,t){this._segmentLabel.anchor=t===C.AboveSegment?"top":"bottom",this._segmentLabel.geometry={type:"segment",segment:e,sampleLocation:"center"}}_updateSegmentAndTriangle({view:{renderCoordsHelper:e},camera:t,segment:i,orientation:s,startPosition:n,endPosition:o,deltaSign:r,altitudeDelta:l}){const a=this._cornerPosition;e.worldUpAtPosition(n,a),V(a,a,r*Math.abs(l)),P(a,a,n),this._triangleVisualElement.geometry=[[[n[0],n[1],n[2]],[a[0],a[1],a[2]],[o[0],o[1],o[2]]]],this._rightAngleQuad.geometry={previous:n,center:a,next:o};const c=new U(n,a),d=new U(a,o),h=N(n,o,a,s,t);this._segmentLabel.anchor=h.segment,this._segmentLabel.geometry={type:"segment",segment:i,sampleLocation:"center"},this._verticalLabel.geometry={type:"segment",segment:c,sampleLocation:"center"},this._verticalLabel.anchor=h.vertical,this._horizontalLabel.geometry={type:"segment",segment:d,sampleLocation:"center"},this._horizontalLabel.anchor=h.horizontal}_updateSegmentAndProjection({view:{renderCoordsHelper:e},orientation:t,startPosition:i,endPosition:s}){e.setAltitude(this._startPositionAtSeaLevel,0,i),e.setAltitude(this._endPositionAtSeaLevel,0,s);const n=new k(this._startPositionAtSeaLevel,this._endPositionAtSeaLevel,e.spatialReference);this._projectedGeodesicLine.setGeometryFromSegment(n),this._geodesicStartHint.setGeometryFromSegment(new U(this._startPositionAtSeaLevel,i)),this._geodesicEndHint.setGeometryFromSegment(new U(this._endPositionAtSeaLevel,s)),this._segmentLabel.geometry={type:"segment",segment:n,sampleLocation:"center"},this._segmentLabel.anchor=t===C.AboveSegment?"top":"bottom"}_updateLabelText({text:e,visualizedMeasurement:t}){null!=e?(this._segmentLabel.text="euclidean"===t?e.directDistance:e.horizontalDistance,this._horizontalLabel.text=e.horizontalDistance,this._verticalLabel.text=e.verticalDistance):(this._segmentLabel.text=null,this._horizontalLabel.text=null,this._verticalLabel.text=null),this.notifyChange("labels")}_updateLabelVisibility({visible:e,viewMode:t}){const i=this._segmentLabel,s=this._horizontalLabel,n=this._verticalLabel;if(i.visible=!1,s.visible=!1,n.visible=!1,e)switch(t){case M.Direct:i.visible=!0;break;case M.Triangle:i.visible=!0,s.visible=!0,n.visible=!0;break;case M.ProjectedGeodesic:i.visible=!0;case M.None:}}get _labelsText(){if(this.destroyed)return null;const e=this.messages,t=this.analysisView.result;if(null==t||null==e)return null;const{directDistance:i,horizontalDistance:s,verticalDistance:n}=t,o=this.analysisView.unit,r=e=>({directDistance:"",horizontalDistance:"",verticalDistance:"",...e});switch(o){case"metric":return r({directDistance:i&&g(e,i),horizontalDistance:s&&g(e,s),verticalDistance:n&&m(e,n)});case"imperial":return r({directDistance:i&&u(e,i),horizontalDistance:s&&u(e,s),verticalDistance:n&&h(e,n)});default:return r({directDistance:i&&d(e,i,o),horizontalDistance:s&&d(e,s,o),verticalDistance:n&&d(e,n,o)})}}_updateSegmentStripeLength(e){const t=this._segmentVisualElement;null!=e?(t.stripeLength=e,t.stripesEnabled=!0):t.stripesEnabled=!1}get _actualVisualElementsOrientation(){if(null!=this._triangleOrientationOverride)return this._triangleOrientationOverride;const e=this.visualElementOrientation;return e===C.Auto?this.view.state.camera.aboveGround?C.AboveSegment:C.BelowSegment:e}_requiresGeodesicGuideAt(e){const t=this.view;if(!t?.state)return!1;const i=t.state.camera,s=t.renderCoordsHelper;if(!s)return!1;const n=i.computeScreenPixelSizeAt(e);return s.getAltitude(e)/n>=10}get _measurementArrowStripeLength(){const{result:e,unit:t}=this.analysisView;if(null==e)return null;let i=null;const s=e.directDistance;switch(t){case"metric":i=s&&p(s,"meters");break;case"imperial":i=s&&p(s,S(s.value,s.unit));break;default:i=s&&p(s,t)}if(null==i)return null;return l(i.value/30)*f(1,i.unit,"meters")}_updateMessageBundle(){this.loadingMessages=!0,B("esri/core/t9n/Units").then((e=>{this.messages=e})).finally((()=>{this.loadingMessages=!1}))}get testData(){}};function N(e,t,i,s,n){const o=J,r=K;n.projectToRenderScreen(i,o),n.projectToRenderScreen(t,r);const l={segment:"bottom",horizontal:"top",vertical:o[0]<r[0]?"left":"right"};{const s=X,o=Y;if(O(e,i,n,s),O(e,t,n,o),E(s,o)>=I){const e=Math.sign(s[1])===Math.sign(o[1]);l.segment=e?x(l.vertical):l.vertical}else{const e=Z;O(i,t,n,e),E(e,o)>=I&&(l.segment=Math.sign(e[0])===Math.sign(o[0])?x(l.horizontal):l.horizontal)}}if(s===C.BelowSegment){const e=e=>"top"===e?"bottom":"top";l.segment=e(l.segment),l.horizontal=e(l.horizontal),l.vertical=e(l.vertical)}return l}e([y()],W.prototype,"_parameters",null),e([y()],W.prototype,"_triangleOrientationOverride",void 0),e([y()],W.prototype,"messages",void 0),e([y()],W.prototype,"view",void 0),e([y()],W.prototype,"analysis",void 0),e([y()],W.prototype,"analysisView",void 0),e([y()],W.prototype,"loadingMessages",void 0),e([y()],W.prototype,"visible",null),e([y()],W.prototype,"viewMode",null),e([y()],W.prototype,"actualVisualizedMeasurement",null),e([y()],W.prototype,"visualElementOrientation",void 0),e([y()],W.prototype,"triangleCollapseRatioThreshold",void 0),e([y()],W.prototype,"allowVisualElementsOrientationChange",null),e([y()],W.prototype,"labels",null),e([y()],W.prototype,"_labelsText",null),e([y()],W.prototype,"_actualVisualElementsOrientation",null),e([y()],W.prototype,"_measurementArrowStripeLength",null),W=e([A("esri.views.3d.analysis.DirectLineMeasurement.DirectLineMeasurementVisualization")],W);const I=Math.cos(a(12)),J=L(),K=L(),X=w(),Y=w(),Z=w();export{W as DirectLineMeasurementVisualization};