@arcgis/core/symbols/cim/rasterizingUtils.js

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

/* COPYRIGHT Esri - https://js.arcgis.com/5.0.8/LICENSE.txt */
import{packFloatRGBA as t}from"../../core/floatRGBA.js";import o from"../../core/Logger.js";import{nextPowerOfTwo as e}from"../../core/mathUtils.js";import{dashSdfRasterizationScale as n,dashSdfDistanceNormalization as r,dashRadius as a}from"./constants.js";import{defaultCIMValues as l}from"./defaultCIMValues.js";import{gradientTextureExternalPadding as s}from"../../views/2d/engine/webgl/definitions.js";const i=()=>o.getLogger("esri.symbols.cim.rasterizingUtils"),c=32,h=t=>"vertical"===t||"horizontal"===t||"cross"===t||"esriSFSCross"===t||"esriSFSVertical"===t||"esriSFSHorizontal"===t;function f(t,o,n){const r=o.style,a=e(Math.ceil(n)),l=h(r)?8*a:16*a,s=2*a;t.width=l,t.height=l;const i=t.getContext("2d");i.strokeStyle="#ffffff",i.lineWidth=a,i.beginPath(),"vertical"!==r&&"cross"!==r&&"esriSFSCross"!==r&&"esriSFSVertical"!==r||(i.moveTo(l/2,-s),i.lineTo(l/2,l+s)),"horizontal"!==r&&"cross"!==r&&"esriSFSCross"!==r&&"esriSFSHorizontal"!==r||(i.moveTo(-s,l/2),i.lineTo(l+s,l/2)),"backward-diagonal"!==r&&"diagonal-cross"!==r&&"esriSFSDiagonalCross"!==r&&"esriSFSBackwardDiagonal"!==r||(i.moveTo(-s,-s),i.lineTo(l+s,l+s),i.moveTo(l-s,-s),i.lineTo(l+s,s),i.moveTo(-s,l-s),i.lineTo(s,l+s)),"forward-diagonal"!==r&&"diagonal-cross"!==r&&"esriSFSForwardDiagonal"!==r&&"esriSFSDiagonalCross"!==r||(i.moveTo(l+s,-s),i.lineTo(-s,l+s),i.moveTo(s,-s),i.lineTo(-s,s),i.moveTo(l+s,l-s),i.lineTo(l-s,l+s)),i.stroke();const c=i.getImageData(0,0,t.width,t.height),f=new Uint8Array(c.data);let u;for(let e=0;e<f.length;e+=4)u=f[e+3]/255,f[e]=f[e]*u,f[e+1]=f[e+1]*u,f[e+2]=f[e+2]*u;return[f,t.width,t.height,a]}function u(o){o.length%2==1&&(o=[...o,...o]);let e=0,a=o.length-1;for(;e<o.length&&0===o[e];)e++;for(;a>=0&&0===o[a];)a--;let l=0;const s=[];for(let t=e;t<=a;t++)0===o[t]?l++:0===l?s.push(o[t]):1&l?(s[s.length-1]+=o[t],l=0):(s.push(o[t]),l=0);if(l=e+o.length-1-a,(o=s).length<=1)return 0===o.length||e%2==0?[new Uint8Array,0,1]:[new Uint8Array([255,255,255,255]),1,1];const i=o.reduce((t,o)=>t+o,0),c=Math.round(i*n),h=1,f=c*h,u=new Float32Array(f);let m=0,g=0,d=.5,p=e%2==0;const C=l%2==1;for(let t=0;t<o.length;t++){for(m=g,g+=o[t]*n,0===t&&C&&(m-=o[o.length-1]*n),t===o.length-1&&C&&(g+=o[0]*n);d<=g&&d-.5<f;){const t=d-.5,o=Math.min(Math.abs(d-m),Math.abs(d-g));u[t]=p?-o:o,d++}p=!p}const M=u.length,x=new Uint8Array(4*M);for(let w=0;w<M;++w){const o=u[w]/n;t(o/r*.5+.5,x,4*w)}return[x,c,h]}function m(o,e){null==o&&(o=[]);const n="Butt"===e,r="Square"===e,l=!n&&!r;o.length%2==1&&(o=[...o,...o]);const s=a,i=2*s;let c=0;for(const t of o)c+=t;const h=Math.round(c*s),f=new Float32Array(h*i),u=.5*s;let m=0,g=0,d=.5,p=!0;for(const t of o){for(m=g,g+=t*s;d<=g;){let t=.5;for(;t<i;){const o=(t-.5)*h+d-.5,e=l?(t-s)*(t-s):Math.abs(t-s);f[o]=p?n?Math.max(Math.max(m+u-d,e),Math.max(d-g+u,e)):e:l?Math.min((d-m)*(d-m)+e,(d-g)*(d-g)+e):r?Math.min(Math.max(d-m,e),Math.max(g-d,e)):Math.min(Math.max(d-m+u,e),Math.max(g+u-d,e)),t++}d++}p=!p}const C=f.length,M=new Uint8Array(4*C);for(let a=0;a<C;++a){const o=(l?Math.sqrt(f[a]):f[a])/s;t(o,M,4*a)}return[M,h,i]}function g(t,o){const{colorRamp:e,gradientType:n}=o,r="CIMFixedColorRamp"===e.type,a=o.interval||l.CIMGradientFill.interval;let s=C(e);return r&&(s=M(s,a)),"Discrete"===n||r?w(t,s,a):x(t,s)}let d;function p(t,o){const{colorRamp:e,gradientType:n}=o,r=C(e),a="CIMFixedColorRamp"===e.type;if("Continuous"===n&&!a)return y(t,r);const s=o.interval??l.CIMGradientFill.interval;if(a){return y(t,M(r,s))}const i=[];d??=document.createElement("canvas"),S(d,r,s,1,0);const c=d.getContext("2d").getImageData(0,0,s,1).data;for(let l=0,h=0;l<s;l++,h=4*l){const t=[c[h+0],c[h+1],c[h+2],c[h+3]];i.push({offset:l/s,color:t}),i.push({offset:(l+1)/s,color:t})}return y(t,i)}function C(t){const o=[];switch(t.type){case"CIMPolarContinuousColorRamp":case"CIMLinearContinuousColorRamp":{"CIMPolarContinuousColorRamp"===t.type&&i().warnOnce("CIMPolarContinuousColorRamp is currently unsupported. Falling back to CIMLinearContinuousColorRamp.");const e=t;o.push({offset:0,color:[e.fromColor[0],e.fromColor[1],e.fromColor[2],e.fromColor[3]/255]}),o.push({offset:1,color:[e.toColor[0],e.toColor[1],e.toColor[2],e.toColor[3]/255]});break}case"CIMFixedColorRamp":{const e=t,n=1/(e.colors.length-1);let r=0;for(const t of e.colors)o.push({offset:r,color:[t[0],t[1],t[2],t[3]/255]}),r+=n;break}case"CIMMultipartColorRamp":{const e=t,n=e.weights.reduce((t,o)=>t+o,0);let r=0;for(let t=0;t<e.colorRamps.length;t++){const a=e.colorRamps[t],l=e.weights[t],s=C(a);for(const t of s)o.push({offset:(r+t.offset*l)/n,color:t.color});r+=l}break}default:i().error(`Color ramp "${t.type}" currently unsupported.`)}return o}function M(t,o){const e=[],n=(t.length-1)/(o-1);for(let r=0;r<o;r++){const a=t[Math.round(r*n)].color;e.push({offset:r/o,color:a}),e.push({offset:(r+1)/o,color:a})}return e}function x(t,o){return S(t,o,c,1,s),F(t)}function w(t,o,e){return S(t,o,e,1,s),F(t)}function y(t,o,e=0){for(const{offset:n,color:r}of o)t.addColorStop(Math.min(Math.max(n,e),1-e),`rgba(${r[0]}, ${r[1]}, ${r[2]}, ${r[3]})`)}function S(t,o,e,n,r){const a=e+2*r;t.width=a,t.height=n;const l=(r+1)/a,s=t.getContext("2d",{willReadFrequently:!0});if(o.length>0){const t=s.createLinearGradient(0,0,a,n);y(t,o,l),s.fillStyle=t}else s.fillStyle="rgba(128, 128, 128, 1)";s.fillRect(0,0,a,n)}function F(t){const{width:o,height:e}=t,n=t.getContext("2d").getImageData(0,0,o,e),r=new Uint8Array(n.data);for(let a=0;a<r.length;a+=4){const t=r[a+3]/255;r[a]*=t,r[a+1]*=t,r[a+2]*=t}return[r,o,e]}function v(t){const o=t[0]?.[0]?.[0]??0,e=t[0]?.[0]?.[1]??0,n={ymin:e,xmin:o,ymax:e,xmax:o,width:0,height:0};for(let r=0;r<t.length;r++){const o=t[r];for(let t=0;t<o.length;t++){const e=o[t][0],r=o[t][1];e<n.xmin&&(n.xmin=e),e>n.xmax&&(n.xmax=e),r<n.ymin&&(n.ymin=r),r>n.ymax&&(n.ymax=r)}}return n.width=Math.abs(n.xmax-n.xmin),n.height=Math.abs(n.ymax-n.ymin),n}function T(t,o){const e=v(t),n=0===e.width?1:e.width,r=0===e.height?1:e.height,a=[];for(let l=0;l<t.length;l++){const s=t[l],i=[];for(let t=0;t<s.length;t++){let a=Math.round(s[t][0]-e.xmin),l=Math.round(s[t][1]-e.ymin);if(a=o.xmin+a*o.width/n,l=o.ymin+l*o.height/r,isNaN(a)||isNaN(l))throw new Error("Scaled shape has NaN values");i.push([a,l])}a.push(i)}return a}function R(t,o,e){const n=[];for(let r=0;r<t.length;r++){const a=t[r],l=[];for(let t=0;t<a.length;t++){const n=a[t][0]+o,r=a[t][1]+e;if(isNaN(n)||isNaN(r))throw new Error("Scaled shape has NaN values");l.push([n,r])}n.push(l)}return n}export{p as addColorStops,m as rasterizeDash,u as rasterizeDash1D,f as rasterizeFillStyle,g as rasterizeGradient,T as scale,R as translate};