@arcgis/core/symbols/cim/CIMSymbolDrawHelper.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{defaultFontFamily as t}from"../../core/fontUtils.js";import has from"../../core/has.js";import{clone as e}from"../../core/lang.js";import r from"../../core/Logger.js";import{deg2rad as i}from"../../core/mathUtils.js";import s from"../../core/ObjectPool.js";import{px2pt as o,pt2px as n}from"../../core/screenUtils.js";import{GeometryCursor as a}from"../../geometry/GeometryCursor.js";import{create as l,fromValues as h,empty as c,expandPointInPlace as m,center as f,width as u,height as d,diagonal as g}from"../../geometry/support/aaBoundingRect.js";import{getBoundsXY as p}from"../../geometry/support/boundsUtils.js";import{polygonCentroid as _}from"../../geometry/support/centroid.js";import{isExtent as y,isPolygon as P,isPolyline as S,isMultipoint as w,isPoint as x}from"../../geometry/support/jsonUtils.js";import{SimpleEffectCursor as M}from"./CIMEffects.js";import b from"./CIMImageColorSubstitutionHelper.js";import{getEffectOperator as k,getPlacementOperator as C}from"./CIMOperators.js";import{Placement as v}from"./CIMPlacements.js";import{defaultCIMValues as I}from"./defaultCIMValues.js";import{LineCapStyle as T,LineJoinStyle as R}from"./enums.js";import{getFirstFrame as z}from"./imageUtils.js";import{rotate as L}from"./mathUtils.js";import{addColorStops as F}from"./rasterizingUtils.js";import U from"./Rect.js";import A from"./TextRasterizer.js";import{isCIMFill as j,getSize as G,getNumericValue as D,isSVGImage as H,getRelativeGradientSize as B,fromCIMFontDecoration as E,fromCIMFontStyle as X,fromCIMHorizontalAlignment as J,fromCIMVerticalAlignment as N,getFillColor as O,getStrokeColor as q,getStrokeWidth as V,getFontWeight as W,getFontStyle as Y}from"./utils.js";import{destroyHiddenSvg as $,createHiddenSvg as K,createSvgElement as Q}from"../../views/2d/engine/svgUtils.js";import{magicLabelLineHeight as Z,glyphSize as tt,hittestToleranceSmallSymbol as et,hittestSmallSymbolThreshold as rt}from"../../views/2d/engine/webgl/definitions.js";import{shapeGlyphs as it}from"../../views/2d/engine/webgl/mesh/templates/shapingUtils.js";import{roundPtToWholePixel as st,getLineWidth as ot}from"../../views/2d/layers/graphics/graphicsUtils.js";const nt=Math.PI/180,at=.5,lt=()=>r.getLogger("esri.symbols.cim.CIMSymbolDrawHelper");class ht{constructor(t){this._t=t}static createIdentity(){return new ht([1,0,0,0,1,0])}clone(){const t=this._t;return new ht(t.slice())}transform(t){const e=this._t;return[e[0]*t[0]+e[1]*t[1]+e[2],e[3]*t[0]+e[4]*t[1]+e[5]]}static createScale(t,e){return new ht([t,0,0,0,e,0])}scale(t,e){const r=this._t;return r[0]*=t,r[1]*=t,r[2]*=t,r[3]*=e,r[4]*=e,r[5]*=e,this}scaleRatio(){return Math.sqrt(this._t[0]*this._t[0]+this._t[1]*this._t[1])}static createTranslate(t,e){return new ht([0,0,t,0,0,e])}translate(t,e){const r=this._t;return r[2]+=t,r[5]+=e,this}static createRotate(t){const e=Math.cos(t),r=Math.sin(t);return new ht([e,-r,0,r,e,0])}rotate(t){return ht.multiply(this,ht.createRotate(t),this)}angle(){const t=this._t[0],e=this._t[3],r=Math.sqrt(t*t+e*e);return[t/r,e/r]}static multiply(t,e,r){const i=t._t,s=e._t,o=i[0]*s[0]+i[3]*s[1],n=i[1]*s[0]+i[4]*s[1],a=i[2]*s[0]+i[5]*s[1]+s[2],l=i[0]*s[3]+i[3]*s[4],h=i[1]*s[3]+i[4]*s[4],c=i[2]*s[3]+i[5]*s[4]+s[5],m=r._t;return m[0]=o,m[1]=n,m[2]=a,m[3]=l,m[4]=h,m[5]=c,r}invert(){const t=this._t;let e=t[0]*t[4]-t[1]*t[3];if(0===e)return new ht([0,0,0,0,0,0]);e=1/e;const r=(t[1]*t[5]-t[2]*t[4])*e,i=(t[2]*t[3]-t[0]*t[5])*e,s=t[4]*e,o=-t[1]*e,n=-t[3]*e,a=t[0]*e;return new ht([s,o,r,n,a,i])}}class ct{constructor(t,e){this._resourceManager=t,this._transfos=[],this._sizeTransfos=[],this._geomUnitsPerPoint=1,this._placementPool=new s(v,void 0,void 0,100),this._earlyReturn=!1,this._mapRotation=0,this._transfos.push(e||ht.createIdentity()),this._sizeTransfos.push(e?e.scaleRatio():1)}setTransform(t,e){this._transfos=[t||ht.createIdentity()],this._sizeTransfos=[e||(t?t.scaleRatio():1)]}setGeomUnitsPerPoint(t){this._geomUnitsPerPoint=t}transformPt(t){return this._transfos[this._transfos.length-1].transform(t)}transformSize(t){return t*this._sizeTransfos[this._sizeTransfos.length-1]}reverseTransformPt(t){return this._transfos[this._transfos.length-1].invert().transform(t)}reverseTransformSize(t){return t/this._sizeTransfos[this._sizeTransfos.length-1]}reverseTransformScalar(t){return t/this._transfos[this._transfos.length-1].scaleRatio()}getTransformAngle(){return this._transfos[this._transfos.length-1].angle()}geomUnitsPerPoint(){return this.isEmbedded()?1:this._geomUnitsPerPoint}prevGeomUnitsPerPoint(){return this._transfos.length>2?1:this._geomUnitsPerPoint}isEmbedded(){return this._transfos.length>1}back(){return this._transfos[this._transfos.length-1]}push(t,e){const r=e?t.scaleRatio():1;ht.multiply(t,this.back(),t),this._transfos.push(t),this._sizeTransfos.push(this._sizeTransfos[this._sizeTransfos.length-1]*r)}pop(){this._transfos.splice(-1,1),this._sizeTransfos.splice(-1,1)}drawSymbol(t,e,r){if(t)switch(t.type){case"CIMPointSymbol":case"CIMLineSymbol":case"CIMPolygonSymbol":this.drawMultiLayerSymbol(t,e);break;case"CIMTextSymbol":this.drawTextSymbol(t,e,r)}}drawMultiLayerSymbol(t,e){if(!t||!e)return;const r=t.symbolLayers;if(!r)return;const i=t.effects;if(i&&i.length>0){const t=this.executeEffects(i,e);if(t){let e=t.next();for(;e;)this.drawSymbolLayers(r,e.asJSON()),e=t.next()}}else this.drawSymbolLayers(r,e)}executeEffects(t,e){const r=this._resourceManager.geometryEngine;let i=new M(a.fromJSONCIM(e));for(const s of t){const t=k(s);t&&(i=t.execute(i,s,this.geomUnitsPerPoint(),null,r))}return i}drawSymbolLayers(t,e){let r=t.length;for(;r--;){const i=t[r];if(!i||!1===i.enable)continue;const s=i.effects;if(s&&s.length>0){const t=this.executeEffects(s,e);if(t){let e=null;for(;(e=t.next())&&(this.drawSymbolLayer(i,e.asJSON()),!this._earlyReturn););}}else this.drawSymbolLayer(i,e);if(this._earlyReturn)return}}drawSymbolLayer(t,e){switch(t.type){case"CIMSolidFill":this.drawSolidFill(e,t.color,t.path);break;case"CIMHatchFill":this.drawHatchFill(e,t);break;case"CIMPictureFill":this.drawPictureFill(e,t);break;case"CIMGradientFill":this.drawGradientFill(e,t);break;case"CIMSolidStroke":this.drawSolidStroke(e,t.color,t.width,t.capStyle,t.joinStyle,t.miterLimit,t.path);break;case"CIMPictureStroke":this.drawPictureStroke(e,t);break;case"CIMGradientStroke":this.drawGradientStroke(e,t);break;case"CIMCharacterMarker":case"CIMPictureMarker":case"CIMVectorMarker":this.drawMarkerLayer(t,e)}}drawHatchFill(t,e){const r=dt(e,t,this.geomUnitsPerPoint());r&&(this.pushClipPath(t),this.drawMultiLayerSymbol(e.lineSymbol,r),this.popClipPath())}drawPictureFill(t,e){}drawGradientFill(t,e){}drawPictureStroke(t,e){}drawGradientStroke(t,e){}drawMarkerLayer(t,e){const r=t.markerPlacement;if(r){const i=C(r);if(i){const s="CIMMarkerPlacementInsidePolygon"===r.type||"CIMMarkerPlacementPolygonCenter"===r.type&&r.clipAtBoundary;s&&this.pushClipPath(e);const o=i.execute(a.fromJSONCIM(e),r,this.geomUnitsPerPoint(),null,this._resourceManager.geometryEngine);if(o){let e=null;for(;(e=o.next())&&(this.drawMarker(t,e),!this._earlyReturn););}s&&this.popClipPath()}}else{const r=this._placementPool.acquire();if(x(e))r.tx=e.x,r.ty=e.y,this.drawMarker(t,r);else if(P(e)){const i=_(e);i&&([r.tx,r.ty]=i,this.drawMarker(t,r))}else if(S(e)){for(const i of e.paths)for(const e of i)if(r.tx=e[0],r.ty=e[1],this.drawMarker(t,r),this._earlyReturn)break}else for(const i of e.points)if(r.tx=i[0],r.ty=i[1],this.drawMarker(t,r),this._earlyReturn)break;this._placementPool.release(r)}}drawMarker(t,e){switch(t.type){case"CIMCharacterMarker":case"CIMPictureMarker":this.drawPictureMarker(t,e);break;case"CIMVectorMarker":this.drawVectorMarker(t,e)}}drawPictureMarker(t,e){if(!t)return;const r=this._resourceManager.getResource(t.url),i=D(t.size,I.CIMPictureMarker.size);if(null==r||i<=0)return;const s=r.width,o=r.height;if(!s||!o)return;const n=s/o,a=D(t.scaleX,1),l=ht.createIdentity(),h=t.anchorPoint;if(h){let e=h.x,r=h.y;"Absolute"!==t.anchorPointUnits&&(e*=i*n*a,r*=i),l.translate(-e,-r)}let c=D(t.rotation);t.rotateClockwise&&(c=-c),this._mapRotation&&(c+=this._mapRotation),c&&l.rotate(c*nt);let m=D(t.offsetX),f=D(t.offsetY);if(m||f){if(this._mapRotation){const t=nt*this._mapRotation,e=Math.cos(t),r=Math.sin(t),i=m*r+f*e;m=m*e-f*r,f=i}l.translate(m,f)}const u=this.geomUnitsPerPoint();1!==u&&l.scale(u,u);const d=e.getAngle();d&&l.rotate(d),l.translate(e.tx,e.ty),this.push(l,!1),this.drawImage(t,i),this.pop()}drawVectorMarker(t,e){if(!t)return;const r=t.markerGraphics;if(!r)return;const i=D(t.size,I.CIMVectorMarker.size),s=t.frame,o=s?s.ymax-s.ymin:0,n=i&&o?i/o:1,a=ht.createIdentity();s&&a.translate(.5*-(s.xmax+s.xmin),.5*-(s.ymax+s.ymin));const l=t.anchorPoint;if(l){let e=l.x,r=l.y;"Absolute"!==t.anchorPointUnits?s&&(e*=s.xmax-s.xmin,r*=s.ymax-s.ymin):(e/=n,r/=n),a.translate(-e,-r)}1!==n&&a.scale(n,n);let h=D(t.rotation);t.rotateClockwise&&(h=-h),this._mapRotation&&(h+=this._mapRotation),h&&a.rotate(h*nt);let c=D(t.offsetX),m=D(t.offsetY);if(c||m){if(this._mapRotation){const t=nt*this._mapRotation,e=Math.cos(t),r=Math.sin(t),i=c*r+m*e;c=c*e-m*r,m=i}a.translate(c,m)}const f=this.geomUnitsPerPoint();1!==f&&a.scale(f,f);const u=e.getAngle();u&&a.rotate(u),a.translate(e.tx,e.ty),this.push(a,t.scaleSymbolsProportionally);for(const d of r){d?.symbol&&d.geometry||lt().error("Invalid marker graphic",d);let t=d.textString;if("number"==typeof t&&(t=t.toString()),this.drawSymbol(d.symbol,d.geometry,t),this._earlyReturn)break}this.pop()}drawTextSymbol(t,e,r){if(!t)return;if(!x(e))return;if(D(t.height,I.CIMTextSymbol.height)<=0)return;const i=ht.createIdentity();let s=D(t.angle);s=-s,s&&i.rotate(s*nt);const o=D(t.offsetX),n=D(t.offsetY);(o||n)&&i.translate(o,n);const a=this.geomUnitsPerPoint();1!==a&&i.scale(a,a),i.translate(e.x,e.y),this.push(i,!1),this.drawText(t,r),this.pop()}}class mt extends ct{constructor(t,e){super(t,e),this.reset()}reset(){this._xmin=this._ymin=1/0,this._xmax=this._ymax=-1/0,this._clipCount=0}envelope(){return new U(this._xmin,this._ymin,this._xmax-this._xmin,this._ymax-this._ymin)}bounds(){return h(this._xmin,this._ymin,this._xmax,this._ymax)}drawSolidFill(t){if(t&&!(this._clipCount>0))if(P(t))this._processPath(t.rings,0);else if(S(t))this._processPath(t.paths,0);else if(y(t)){const e=yt(t);e&&this._processPath(e.rings,0)}else console.error("drawSolidFill Unexpected geometry type!")}drawSolidStroke(t,e,r){if(!t||this._clipCount>0||null==r||r<=0)return;const i=Math.max(.5*this.transformSize(D(r,I.CIMSolidStroke.width)),.5*at);if(P(t))this._processPath(t.rings,i);else if(S(t))this._processPath(t.paths,i);else if(y(t)){const e=yt(t);e&&this._processPath(e.rings,i)}else console.error("drawSolidStroke unexpected geometry type!")}drawMarkerLayer(t,e){P(e)&&t.markerPlacement&&("CIMMarkerPlacementInsidePolygon"===t.markerPlacement.type||"CIMMarkerPlacementPolygonCenter"===t.markerPlacement.type&&t.markerPlacement.clipAtBoundary)?this._processPath(e.rings,0):super.drawMarkerLayer(t,e)}drawHatchFill(t,e){this.drawSolidFill(t)}drawPictureFill(t,e){this.drawSolidFill(t)}drawGradientFill(t,e){this.drawSolidFill(t)}drawPictureStroke(t,e){this.drawSolidStroke(t,null,e.width)}drawGradientStroke(t,e){this.drawSolidStroke(t,null,e.width)}pushClipPath(t){this.drawSolidFill(t),this._clipCount++}popClipPath(){this._clipCount--}drawImage(t,e){const{url:r}=t,i=D(t.scaleX,1);let s=i*e,o=e;const n=this._resourceManager.getResource(r);if(null!=n){const t=n.height/n.width;s=i*(e?t>1?e:e/t:n.width),o=e?t>1?e*t:e:n.height}this._merge(this.transformPt([-s/2,-o/2]),0),this._merge(this.transformPt([-s/2,o/2]),0),this._merge(this.transformPt([s/2,-o/2]),0),this._merge(this.transformPt([s/2,o/2]),0)}drawText(t,e){if(!e||0===e.length)return;this._textRasterizer||(this._textRasterizer=new A);const r=St(t);let[i,s]=this._textRasterizer.computeTextSize(e,r);i=o(i),s=o(s);const n=this.transformSize(1)*this.reverseTransformScalar(1);i*=n,s*=n;let a=0;switch(t.horizontalAlignment){case"Left":a=i/2;break;case"Right":a=-i/2}let l=0;switch(t.verticalAlignment){case"Bottom":l=s/2;break;case"Top":l=-s/2;break;case"Baseline":l=s/6}this._merge(this.transformPt([-i/2+a,-s/2+l]),0),this._merge(this.transformPt([-i/2+a,s/2+l]),0),this._merge(this.transformPt([i/2+a,-s/2+l]),0),this._merge(this.transformPt([i/2+a,s/2+l]),0)}_processPath(t,e){if(t)for(const r of t){const t=r?r.length:0;if(t>1){this._merge(this.transformPt(r[0]),e);for(let i=1;i<t;i++)this._merge(this.transformPt(r[i]),e)}}}_merge(t,e){t[0]-e<this._xmin&&(this._xmin=t[0]-e),t[0]+e>this._xmax&&(this._xmax=t[0]+e),t[1]-e<this._ymin&&(this._ymin=t[1]-e),t[1]+e>this._ymax&&(this._ymax=t[1]+e)}}class ft extends ct{constructor(){super(...arguments),this._searchPoint=[0,0],this._searchDistPoint=0,this._textInfo=null,this._svg=null,this._path=null,this._canvas=null}destroy(){this._svg=$(this._svg),this._path=null,this._canvas=null}hitTest(t,e,r,i,s,a){const l=a*n(1);this.setTransform(),this.setGeomUnitsPerPoint(l),this._searchPoint=[(t[0]+t[2])/2,(t[1]+t[3])/2],this._searchDistPoint=(t[2]-t[0])/2/l,this._textInfo=i;const h=e&&("CIMPointSymbol"===e.type&&"Map"!==e.angleAlignment||"CIMTextSymbol"===e.type);if(this._mapRotation=h?s:0,!has("esri-mobile")){const t=o(et*window.devicePixelRatio),r=o(rt);!(("CIMLineSymbol"===e?.type||"CIMPolygonSymbol"===e?.type)&&e.symbolLayers?.some(j))&&"CIMMeshSymbol"!==e?.type&&(G(e)??0)<r&&(this._searchDistPoint=t)}return this._earlyReturn=!1,this.drawSymbol(e,r),this._earlyReturn}executeEffects(t,e){return"CIMGeometricEffectDashes"===t.at(-1)?.type&&(t=t.slice(0,-1)),super.executeEffects(t,e)}drawSolidFill(t,e,r){null!=r?this._hittestSvgPath(t,r,!0):this._hitTestFill(t)}drawHatchFill(t,e){this._hitTestFill(t)}drawPictureFill(t,e){this._hitTestFill(t)}drawGradientFill(t,e){this._hitTestFill(t)}drawSolidStroke(t,e,r,i,s,o,n){null!=n?this._hittestSvgPath(t,n,!1,r):this._hitTestStroke(t,r)}drawPictureStroke(t,e){this._hitTestStroke(t,e.width)}drawGradientStroke(t,e){this._hitTestStroke(t,e.width)}drawMarkerLayer(t,e){t.markerPlacement&&("CIMMarkerPlacementInsidePolygon"===t.markerPlacement.type||"CIMMarkerPlacementPolygonCenter"===t.markerPlacement.type&&t.markerPlacement.clipAtBoundary)?this._hitTestFill(e):super.drawMarkerLayer(t,e)}pushClipPath(t){}popClipPath(){}drawImage(t,e){const{url:r}=t,i=D(t.scaleX,1),s=this._resourceManager.getResource(r);if(null==s||0===s.height||0===e)return;const o=e*this.geomUnitsPerPoint(),n=o*i*(s.width/s.height),a=this.reverseTransformPt(this._searchPoint),l=this._searchDistPoint;Math.abs(a[0])<n/2+l&&Math.abs(a[1])<o/2+l&&(this._earlyReturn=!0)}drawText(t,e){const r=this._textInfo;if(!r)return;const i=r.get(t);if(!i)return;if(!i.glyphMosaicItems.glyphs.length)return;const s=st(D(t.height,I.CIMTextSymbol.height)),{lineGapType:o,lineGap:n}=t,a=o?Pt(o,D(n),s):0,l="CIMBackgroundCallout"===t.callout?.type,h=it(i.glyphMosaicItems,{scale:s/tt,angle:0,xOffset:0,yOffset:0,horizontalAlignment:t.horizontalAlignment,verticalAlignment:t.verticalAlignment,maxLineWidth:ot(t.lineWidth),lineHeight:Z*Math.max(.25,Math.min(a||1,4)),decoration:t.font.decoration||"none",useCIMAngleBehavior:!0,hasBackground:l}),c=this.reverseTransformPt(this._searchPoint),m=c[0],f=c[1];for(const u of h.glyphs)if(m>u.xTopLeft&&m<u.xBottomRight&&f>-u.yBottomRight&&f<-u.yTopLeft){this._earlyReturn=!0;break}}_hitTestFill(t){let e=null;if(y(t)){const r=t;e=[[[r.xmin,r.ymin],[r.xmin,r.ymax],[r.xmax,r.ymax],[r.xmax,r.ymin],[r.xmin,r.ymin]]]}else if(P(t))e=t.rings;else{if(!S(t))return;e=t.paths}const r=this.reverseTransformPt(this._searchPoint);if(gt(r,e)&&(this._earlyReturn=!0),!this._earlyReturn){pt(r,e,this.reverseTransformScalar(this._searchDistPoint)*this.prevGeomUnitsPerPoint())&&(this._earlyReturn=!0)}}_getSvgPath(){return null!=this._svg&&null!=this._path||(this._svg??=K(),this._path??=Q("path"),this._svg.appendChild(this._path)),this._path}_getCanvasContext(t,e){return this._canvas??=document.createElement("canvas"),this._canvas.width=t,this._canvas.height=e,this._canvas.getContext("2d",{willReadFrequently:!0})}_hittestSvgPath(t,e,r,i=0){const s=this.reverseTransformScalar(this._searchDistPoint)*this.prevGeomUnitsPerPoint(),o=this.reverseTransformPt(this._searchPoint),n=l();p(n,t);const a={x:n[0],y:n[1],width:n[2]-n[0],height:n[3]-n[1]},h=this._getSvgPath();h.setAttribute("d",e);const c=h.getBBox();let m=Math.max(c.width/a.width,c.height/a.height),f=1;const u=2*s*m;u<1&&(f=2/u,m*=f,c.x*=f,c.y*=f,c.width*=f,c.height*=f);const d=1+i*m/2,g=this._getCanvasContext(c.width+2*d,c.height+2*d);g.setTransform(f,0,0,f,-c.x+d,-c.y+d);const _=new Path2D(e);r?g.fill(_):(g.lineWidth=i*(m/f),g.stroke(_));const y=(a.width*m-c.width)/2,P=(a.height*m-c.height)/2,S=Math.floor((o[0]-a.x-s)*m-y+d),w=Math.floor((a.height-(o[1]-a.y)-s)*m+P+d),x=Math.ceil(2*s*m),M=Math.ceil(2*s*m),b=g.getImageData(S,w,x,M).data;for(let l=3;l<b.length;l+=4)if(b[l]>127.5)return void(this._earlyReturn=!0)}_hitTestStroke(t,e){let r=null;if(y(t)){const e=t;r=[[[e.xmin,e.ymin],[e.xmin,e.ymax],[e.xmax,e.ymax],[e.xmax,e.ymin],[e.xmin,e.ymin]]]}else if(P(t))r=t.rings;else{if(!S(t))return;r=t.paths}pt(this.reverseTransformPt(this._searchPoint),r,D(e,I.CIMSolidStroke.width)*this.geomUnitsPerPoint()/2+this.reverseTransformScalar(this._searchDistPoint)*this.prevGeomUnitsPerPoint())&&(this._earlyReturn=!0)}}class ut extends ct{constructor(t,e,r,i){super(e,r),this._applyAdditionalRenderProps=i,this._colorSubstitutionHelper=new b,this._ctx=t}drawSolidFill(t,e){if(!t)return;if(P(t))this._buildPath(t.rings,!0);else if(S(t))this._buildPath(t.paths,!0);else if(y(t))this._buildPath(yt(t).rings,!0);else{if(!w(t))return;console.log("CanvasDrawHelper.drawSolidFill - No implementation!")}const r=this._ctx;r.fillStyle="string"==typeof e?e:"rgba("+Math.round(e[0])+","+Math.round(e[1])+","+Math.round(e[2])+","+(e[3]??255)/255+")",r.fill("evenodd")}drawSolidStroke(t,e,r,i,s,o){if(!t||!e||0===r)return;if(P(t))this._buildPath(t.rings,!0);else if(S(t))this._buildPath(t.paths,!1);else{if(!y(t))return void console.log("CanvasDrawHelper.drawSolidStroke isn't implemented!");this._buildPath(yt(t).rings,!0)}const n=this._ctx;n.strokeStyle="string"==typeof e?e:"rgba("+Math.round(e[0])+","+Math.round(e[1])+","+Math.round(e[2])+","+(e[3]??255)/255+")",n.lineWidth=Math.max(this.transformSize(r),at),this._setCapStyle(i),this._setJoinStyle(s),n.miterLimit=o,n.stroke()}pushClipPath(t){if(this._ctx.save(),P(t))this._buildPath(t.rings,!0);else if(S(t))this._buildPath(t.paths,!0);else{if(!y(t))return;this._buildPath(yt(t).rings,!0)}this._ctx.clip("evenodd")}popClipPath(){this._ctx.restore()}drawImage(t,e){const{colorSubstitutions:r,url:i,tintColor:s}=t,o=D(t.scaleX,1),n=this._resourceManager.getResource(i);if(null==n)return;let a=e*(n.width/n.height),l=e;e||(a=n.width,l=n.height);const h=H(i)||"src"in n&&H(n.src);let c="getFrame"in n?z(n):n;r&&(c=this._colorSubstitutionHelper.applyColorSubstitution(c,r)),this._applyAdditionalRenderProps&&!h&&s&&(c=this._colorSubstitutionHelper.tintImageData(c,s));const m=this.transformPt([0,0]),[f,u]=this.getTransformAngle(),d=this.transformSize(1),g=this._ctx;g.save(),g.setTransform({m11:o*d*f,m12:o*d*u,m21:-d*u,m22:d*f,m41:m[0],m42:m[1]}),g.drawImage(c,-a/2,-l/2,a,l),g.restore()}drawText(t,e){if(!e||0===e.length)return;this._textRasterizer||(this._textRasterizer=new A);const r=St(t,this.transformSize(o(1))),i=this._textRasterizer.rasterizeText(e,r);if(!i)return;const{size:s,anchorX:n,anchorY:a,canvas:l}=i,h=s[0]*(n+.5),c=s[1]*(a-.5),m=this._ctx,f=this.transformPt([0,0]),[u,d]=this.getTransformAngle(),g=1;m.save(),m.setTransform({m11:g*u,m12:g*d,m21:-1*d,m22:g*u,m41:f[0]-g*h,m42:f[1]+g*c}),m.drawImage(l,0,0),m.restore()}drawPictureFill(t,e){if(!t)return;let{colorSubstitutions:r,height:i,offsetX:s,offsetY:o,rotation:n,scaleX:a,tintColor:l,url:h}=e;const c=this._resourceManager.getResource(h);if(null==c)return;if(P(t))this._buildPath(t.rings,!0);else if(S(t))this._buildPath(t.paths,!0);else if(y(t))this._buildPath(yt(t).rings,!0);else{if(!w(t))return;console.log("CanvasDrawHelper.drawPictureFill - No implementation!")}const m=this._ctx,f=H(h)||"src"in c&&H(c.src);let u,d="getFrame"in c?z(c):c;if(r&&(d=this._colorSubstitutionHelper.applyColorSubstitution(d,r)),this._applyAdditionalRenderProps){f||l&&(d=this._colorSubstitutionHelper.tintImageData(d,l)),u=m.createPattern(d,"repeat");const t=this.transformSize(1);n||(n=0),s?s*=t:s=0,o?o*=t:o=0,i&&(i*=t);const e=i?i/c.height:1,r=a&&i?a*i/c.width:1;if(0!==n||1!==e||1!==r||0!==s||0!==o){const t=new DOMMatrix;t.rotateSelf(0,0,-n).translateSelf(s,o).scaleSelf(r,e,1),u.setTransform(t)}}else u=m.createPattern(d,"repeat");m.save(),m.fillStyle=u,m.fill("evenodd"),m.restore()}drawPictureStroke(t,r){if(!t)return;let{colorSubstitutions:i,capStyle:s,joinStyle:o,miterLimit:a,tintColor:l,url:h,width:c}=r;const m=this._resourceManager.getResource(h);if(null==m)return;let f;if(P(t))f=t.rings;else if(S(t))f=t.paths;else{if(!y(t))return w(t)?void console.log("CanvasDrawHelper.drawPictureStroke - No implementation!"):void 0;f=yt(t).rings}c||(c=m.width);const u=H(h)||"src"in m&&H(m.src);let d="getFrame"in m?z(m):m;i&&(d=this._colorSubstitutionHelper.applyColorSubstitution(d,i)),this._applyAdditionalRenderProps&&(u||l&&(d=this._colorSubstitutionHelper.tintImageData(d,l)));const g=Math.max(this.transformSize(n(c)),.5),p=g/d.width,_=this._ctx,x=_.createPattern(d,"repeat-y");let M,b;_.save(),this._setCapStyle(s),this._setJoinStyle(o),void 0!==a&&(_.miterLimit=a),_.lineWidth=g;for(let n of f)if(n=e(n),xt(n),n&&!(n.length<=1)){M=this.transformPt(n[0]);for(let t=1;t<n.length;t++){b=this.transformPt(n[t]);const e=_t(M,b),r=new DOMMatrix;r.translateSelf(0,M[1]-g/2).scaleSelf(p,p,1).rotateSelf(0,0,90-e),x.setTransform(r),_.strokeStyle=x,_.beginPath(),_.moveTo(M[0],M[1]),_.lineTo(b[0],b[1]),_.stroke(),M=b}}_.restore()}drawGradientFill(t,e){if(!t)return;let r;if(P(t))r=t.rings;else if(S(t))r=t.paths;else{if(!y(t))return void lt().error("Unable to draw gradient fill");r=yt(t).rings}this._buildPath(r,!0);const{angle:s,gradientMethod:o,gradientSize:a,gradientSizeUnits:l}=e,h=I.CIMGradientFill,p=e.gradientType??h.gradientType,_=-i(s??0),w=c();for(const i of r){const t=i?i.length:0;if(t>1)for(let e=0;e<t;e++){let t=this.transformPt(i[e]);"Linear"!==o&&"Rectangular"!==o||(t=L(t,-_)),m(w,t)}}const[x,M,b,k]=w,C=this._ctx;switch(C.save(),o){case"Buffered":lt().error(`Gradient method "${o}" currently unsupported.`);break;case"Linear":{const t=(M+k)/2,r="Absolute"===l?this.transformSize(n(a)):B(a,h.gradientSize)*(b-x),[i,s]="Discrete"===p?[b,b-r]:[x+r,x],o=L([i,t],_),c=L([s,t],_),m=C.createLinearGradient(o[0],o[1],c[0],c[1]);F(m,e),C.fillStyle=m,C.fill("evenodd");break}case"Circular":{const t=f(w),r=g(w)/2,i="Absolute"===l?this.transformSize(n(a)):B(a,h.gradientSize)*r,[s,o]="Discrete"===p?[r,r-i]:[i,0],c=C.createRadialGradient(t[0],t[1],s,t[0],t[1],o);F(c,e),C.fillStyle=c,C.fill("evenodd");break}case"Rectangular":{const r=f(w),i=r[0],s=r[1],o=L(r,_),c=(r,i,s,n,a,l,h,c)=>{C.save(),this.pushClipPath(t);const m=L([a,l],_),f=L([h,c],_);C.beginPath(),C.moveTo(o[0],o[1]),C.lineTo(m[0],m[1]),C.lineTo(f[0],f[1]),C.lineTo(o[0],o[1]),C.clip();const u=L([r,i],_),d=L([s,n],_),g=C.createLinearGradient(u[0],u[1],d[0],d[1]);F(g,e),C.fillStyle=g,C.fill("evenodd"),C.restore()};let m="Absolute"===l?this.transformSize(n(a)):B(a,h.gradientSize)*(u(w)/2),[g,y]="Discrete"===p?[b,b-m]:[i+m,i];c(g,s,y,s,b,M,b,k),[g,y]="Discrete"===p?[x,x+m]:[i-m,i],c(g,s,y,s,x,k,x,M),m="Absolute"===l?this.transformSize(n(a)):B(a,h.gradientSize)*(d(w)/2);let[P,S]="Discrete"===p?[k,k-m]:[s+m,s];c(i,P,i,S,b,k,x,k),[P,S]="Discrete"===p?[M,M+m]:[s-m,s],c(i,P,i,S,x,M,b,M);break}}C.restore()}drawGradientStroke(t,r){const{capStyle:i,gradientMethod:s,gradientSize:o,gradientSizeUnits:a,joinStyle:l,miterLimit:h,width:c}=r;if(!t||0===c)return;let m;if(P(t))m=t.rings;else if(S(t))m=t.paths;else{if(!y(t))return void lt().error("Unable to draw gradient stroke");m=yt(t).rings}const f=r.gradientType??I.CIMGradientStroke.gradientType,u=Math.max(this.transformSize(n(c)),.5),d=this._ctx;let g,p;d.save(),this._setCapStyle(i),this._setJoinStyle(l),void 0!==h&&(d.miterLimit=h),d.lineWidth=u;for(let _ of m){if(_=e(_),xt(_),!_||_.length<=1)continue;let t=0;g=this.transformPt(_[0]);for(let e=1;e<_.length;e++){p=this.transformPt(_[e]);const r=p[0]-g[0],i=p[1]-g[1];t+=Math.sqrt(r*r+i*i),g=p}const i="Absolute"===a?this.transformSize(n(o)):B(o,I.CIMGradientStroke.gradientSize)*("AcrossLine"===s?u:t);let l=0;g=this.transformPt(_[0]);for(let e=1;e<_.length;e++){p=this.transformPt(_[e]);const o=p[0]-g[0],n=p[1]-g[1],a=Math.sqrt(o*o+n*n);let h,c,m,y;switch(s){case"AcrossLine":{const[t,e]=L([o/a,n/a],-Math.PI/2),r=u/2,s="Discrete"===f?r:i-r;h=(g[0]+p[0])/2+t*s,c=(g[1]+p[1])/2+e*s,m=h-t*i,y=c-e*i;break}case"AlongLine":{const e=o/a,r=n/a;"Discrete"===f?(h=g[0]-e*l,c=g[1]-r*l,m=h+e*i,y=c+r*i):(m=g[0]+e*(t-l),y=g[1]+r*(t-l),h=m-e*i,c=y-r*i);break}default:return lt().error("Unrecognized gradient method:",s),void d.restore()}const P=d.createLinearGradient(h,c,m,y);F(P,r),d.strokeStyle=P,d.beginPath(),d.moveTo(g[0],g[1]),d.lineTo(p[0],p[1]),d.stroke(),l+=a,g=p}}d.restore()}_buildPath(t,e){const r=this._ctx;if(r.beginPath(),t)for(const i of t){const t=i?i.length:0;if(t>1){let s=this.transformPt(i[0]);r.moveTo(s[0],s[1]);for(let e=1;e<t;e++)s=this.transformPt(i[e]),r.lineTo(s[0],s[1]);e&&r.closePath()}}}_setCapStyle(t){switch(t){case T.Butt:this._ctx.lineCap="butt";break;case T.Round:this._ctx.lineCap="round";break;case T.Square:this._ctx.lineCap="square"}}_setJoinStyle(t){switch(t){case R.Bevel:this._ctx.lineJoin="bevel";break;case R.Round:this._ctx.lineJoin="round";break;case R.Miter:this._ctx.lineJoin="miter"}}}function dt(t,e,r){let i=D(t.separation,I.CIMHatchFill.separation)*r,s=D(t.rotation);if(0===i)return null;i<0&&(i=-i);let o=0;const n=.5*i;for(;o>n;)o-=i;for(;o<-n;)o+=i;const a=l();p(a,e),a[0]-=n,a[1]-=n,a[2]+=n,a[3]+=n;const h=[[a[0],a[1]],[a[0],a[3]],[a[2],a[3]],[a[2],a[1]]];for(;s>180;)s-=180;for(;s<0;)s+=180;const c=Math.cos(s*nt),m=Math.sin(s*nt),f=-i*m,u=i*c;let d,g,_,y;o=D(t.offsetX)*r*m-D(t.offsetY)*r*c,d=_=Number.MAX_VALUE,g=y=-Number.MAX_VALUE;for(const l of h){const t=l[0],e=l[1],r=c*t+m*e,i=-m*t+c*e;d=Math.min(d,r),_=Math.min(_,i),g=Math.max(g,r),y=Math.max(y,i)}_=Math.floor(_/i)*i;let P=c*d-m*_-f*o/i,S=m*d+c*_-u*o/i,w=c*g-m*_-f*o/i,x=m*g+c*_-u*o/i;const M=1+Math.round((y-_)/i),b=[];for(let l=0;l<M;l++)P+=f,S+=u,w+=f,x+=u,b.push([[P,S],[w,x]]);return{paths:b}}function gt(t,e){let r=0;for(const i of e){const e=i.length;for(let s=1;s<e;s++){const e=i[s-1],o=i[s];if(e[1]>t[1]==o[1]>t[1])continue;(o[0]-e[0])*(t[1]-e[1])-(o[1]-e[1])*(t[0]-e[0])>0?r++:r--}}return 0!==r}function pt(t,e,r){for(const i of e){const e=i.length;for(let s=1;s<e;s++){const e=i[s-1],o=i[s];let n=(o[0]-e[0])*(o[0]-e[0])+(o[1]-e[1])*(o[1]-e[1]);if(0===n)continue;n=Math.sqrt(n);const a=((o[0]-e[0])*(t[1]-e[1])-(o[1]-e[1])*(t[0]-e[0]))/n;if(Math.abs(a)<r){const i=((o[0]-e[0])*(t[0]-e[0])+(o[1]-e[1])*(t[1]-e[1]))/n;if(i>-r&&i<n+r)return!0}}}return!1}function _t(t,e){const r=e[0]-t[0],i=e[1]-t[1];return 180/Math.PI*Math.atan2(i,r)}const yt=t=>t?{spatialReference:t.spatialReference,rings:[[[t.xmin,t.ymin],[t.xmin,t.ymax],[t.xmax,t.ymax],[t.xmax,t.ymin],[t.xmin,t.ymin]]]}:null,Pt=(t,e,r)=>{switch(t){case"ExtraLeading":return 1+e/r;case"Multiple":return e;case"Exact":return e/r}};function St(e,r=1){const i=E(e),s=X(e.fontStyleName),o=e.fontFamilyName??t,{weight:n,style:a}=s,l=r*(e.height||5),h=J(e.horizontalAlignment),c=N(e.verticalAlignment),m=O(e),f=O(e.haloSymbol),u=null!=f?r*(e.haloSize??0):0,d=q(e.symbol),g=r*(V(e.symbol)||0),p="CIMBackgroundCallout"===e.callout?.type?e.callout.backgroundSymbol:null,_=O(p),y=V(p),P=q(p);return{color:m,size:l,horizontalAlignment:h,verticalAlignment:c,font:{family:o,style:Y(a),weight:W(n),decoration:i},outline:{size:g||0,color:d},halo:{size:u||0,color:f,style:a},backgroundColor:_,borderLine:null!=y&&null!=P?{size:y,color:P}:null,pixelRatio:1,premultiplyColors:!0}}const wt=1e-4;function xt(t){let e,r,i,s,o,n=t[0],a=1;for(;a<t.length;)e=t[a][0]-n[0],r=t[a][1]-n[1],s=0!==e?r/e:Math.PI/2,void 0!==i&&Math.abs(s-i)<=wt?(t.splice(a-1,1),n=o):(o=n,n=t[a],a++),i=s}export{ct as CIMSymbolDrawHelper,ut as CanvasDrawHelper,mt as EnvDrawHelper,ft as HittestDrawHelper,ht as Transformation,nt as cDegToRad,Pt as lineGapType2LineHeight};