@doegis/core/symbols/support/symbolUtils.js

DOE GIS API

import"../../core/has.js";import{isSome as e,isNone as t,unwrap as l}from"../../core/maybe.js";import{loadArcade as r}from"../../support/arcadeOnDemand.js";import{getStroke as i}from"./gfxUtils.js";import{SymbolSizeDefaults as s}from"./previewUtils.js";import{renderSymbol as o,renderOnce as n}from"./renderUtils.js";import{getCSSFilterFromEffectList as a,fetchWebStyleSymbol as c,applyColorToSymbol as u,applySizesToSymbol as f,applyRotationToSymbol as p,getColorFromSymbol as h,applyOpacityToColor as y}from"./utils.js";import{renderRelationshipRamp as d}from"../../widgets/Legend/styles/support/relationshipUtils.js";import{getRelationshipRampElement as m}from"../../widgets/Legend/support/relationshipRampUtils.js";let g=null;const b=[255,255,255];function w(e,t){return Math.floor(Math.random()*(t-e+1)+e)}function S(e,t,l){const{backgroundColor:r,outline:i,dotSize:o}=e,n=l&&l.swatchSize||s.size,a=.8,c=Math.round(n*n/o**2*a),u=window.devicePixelRatio,f=document.createElement("canvas"),p=n*u;f.width=p,f.height=p,f.style.width=f.width/u+"px",f.style.height=f.height/u+"px";const h=f.getContext("2d");if(r&&(h.fillStyle=r.toCss(!0),h.fillRect(0,0,p,p),h.fill()),h.fillStyle=t.toCss(!0),g&&g.length/2===c)for(let s=0;s<2*c;s+=2){const e=g[s],t=g[s+1];h.fillRect(e,t,o*u,o*u),h.fill()}else{g=[];for(let e=0;e<2*c;e+=2){const e=w(0,p),t=w(0,p);g.push(e,t),h.fillRect(e,t,o*u,o*u),h.fill()}}i&&(i.color&&(h.strokeStyle=i.color.toCss(!0)),h.lineWidth=i.width,h.strokeRect(0,0,p,p));const y=new Image(n,n);return y.src=f.toDataURL(),y}function v(e,t={}){const l=t.radius||40,r=2*Math.PI*l,s=e.length,n=r/s,a=[],c=i(t.outline);null!=c?.width&&(c.width*=2),(c||t.backgroundColor)&&a.push({shape:{type:"circle",cx:l,cy:l,r:l},fill:t.backgroundColor,stroke:c,offset:[0,0]});const u=t.values,f=u&&u.length===s&&100===u.reduce(((e,t)=>e+t),0),p=[0];for(let i=0;i<s;i++){let t=null;f&&(t=u[i]*r/100,p.push(t+p[i])),a.push({shape:{type:"circle",cx:l,cy:l,r:l/2},fill:[0,0,0,0],stroke:{width:l,dashArray:`${(t??n)/2} ${r}`,dashoffset:"-"+(f?p[i]/2:i*(n/2)),color:e[i]},offset:[0,0]})}let h=null;const y=2*l+(c?.width||0),d=t.holePercentage;if(d){c&&a.push({shape:{type:"circle",cx:l,cy:l,r:l*d},fill:null,stroke:c,offset:[0,0]});const e=y/2;h=[[{shape:{type:"circle",cx:e,cy:e,r:e},fill:b,stroke:c?{...c,color:b}:null,offset:[0,0]},{shape:{type:"circle",cx:e,cy:e,r:l*d},fill:[0,0,0],stroke:null,offset:[0,0]}]]}return o([a],[y,y],{effectView:t.effectList,ignoreStrokeWidth:!0,masking:h,rotation:-90})}function V(e,t={}){const l=e?.authoringInfo;if(!("relationship"===l?.type)||!l?.numClasses||!e.uniqueValueInfos)return null;const{focus:r,numClasses:i}=l,s=m({focus:r,numClasses:i,infos:e.uniqueValueInfos}),o=t&&t.node||document.createElement("div");return n(o,(()=>d(s,t.id||"relationship",t.opacity||1,t.effectList))),o}function x(e,t={}){const l=24,r=75,i="horizontal"===t.align,s=i?r:l,o=i?l:r,{width:n=s,height:a=o,gradient:c=!0}=t,u=window.devicePixelRatio,f=n*u,p=a*u,h=document.createElement("canvas");h.width=f,h.height=p,h.style.width=`${n}px`,h.style.height=`${a}px`;const y=h.getContext("2d"),d=i?f:0,m=i?0:p;if(c){const t=y.createLinearGradient(0,0,d,m),l=e.length,r=1===l?0:1/(l-1);e.forEach(((e,l)=>t.addColorStop(l*r,e.toString()))),y.fillStyle=t,y.fillRect(0,0,f,p)}else{const t=i?f/e.length:f,l=i?p:p/e.length;let r=0,s=0;for(const o of e)y.fillStyle=o.toString(),y.fillRect(r,s,t,l),r=i?r+t:0,s=i?0:s+l}const g=document.createElement("div");return g.style.width=`${n}px`,g.style.height=`${a}px`,k(g,t?.effectList),g.appendChild(h),g}function k(e,t){if(!t)return;e.style.filter=a(t);const l=t.effects;if(l)for(const r of l)if("drop-shadow"===r?.type){r.offsetX<0?e.style.marginLeft=`${Math.abs(r.offsetX)}px`:e.style.marginRight=`${r.offsetX}px`;break}}async function C(e,t){switch(e.type){case"web-style":{const{previewWebStyleSymbol:l}=await import("./previewWebStyleSymbol.js");return l(e,C,t)}case"label-3d":case"line-3d":case"mesh-3d":case"point-3d":case"polygon-3d":{const{previewSymbol3D:l}=await import("./previewSymbol3D.js");return l(e,t)}case"simple-marker":case"simple-line":case"simple-fill":case"picture-marker":case"picture-fill":case"text":{const{previewSymbol2D:l}=await import("./previewSymbol2D.js");return l(e,t)}case"cim":{const{previewCIMSymbol:l}=await import("./previewCIMSymbol.js");return l(e,t)}default:return}}function j(e){return e&&"opacity"in e?e.opacity*j(e.parent):1}async function R(i,s){if(!i)return;const o=i.sourceLayer,n=(e(s)&&s.useSourceLayer?o:i.layer)??o,a=j(n);if(e(i.symbol)&&(!e(s)||!0!==s.ignoreGraphicSymbol)){const t="web-style"===i.symbol.type?await c(i.symbol,{...s,cache:e(s)?s.webStyleCache:null}):i.symbol.clone();return u(t,null,a),t}const h=(e(s)?s.renderer:null)??(n&&"renderer"in n?n.renderer:null);let y=h&&"getSymbolAsync"in h?await h.getSymbolAsync(i,s):null;if(!y)return;if(y="web-style"===y.type?await y.fetchSymbol({...s,cache:e(s)?s.webStyleCache:null}):y.clone(),!(h&&"visualVariables"in h&&h.visualVariables&&h.visualVariables.length))return u(y,null,a),y;if("arcadeRequiredForVisualVariables"in h&&h.arcadeRequiredForVisualVariables&&(t(s)||t(s.arcade))){const e={...l(s)};e.arcade=await r(),s=e}const d=await import("../../renderers/visualVariables/support/visualVariableUtils.js"),m=[],g=[],b=[],w=[];for(const e of h.visualVariables)switch(e.type){case"color":m.push(e);break;case"opacity":g.push(e);break;case"rotation":w.push(e);break;case"size":e.target||b.push(e)}const S=!!m.length&&m[m.length-1],v=S?d.getColor(S,i,s):null,V=!!g.length&&g[g.length-1];let x=V?d.getOpacity(V,i,s):null;if(null!=a&&(x=null!=x?x*a:a),u(y,v,x),b.length){const e=d.getAllSizes(b,i,s);await f(y,e)}for(const e of w)p(y,d.getRotationAngle(e,i,s),e.axis);return y}async function L(i,s){if(!i)return;const o=j(i.layer||i.sourceLayer);if(e(i.symbol)&&(!e(s)||!0!==s.ignoreGraphicSymbol)){const e="web-style"===i.symbol.type?await c(i.symbol,s):i.symbol.clone();return h(e,o)}const n=e(s)&&s.renderer||i.get("layer.renderer")||i.get("sourceLayer.renderer");let a=await n.getSymbolAsync(i,s);if(!a)return;a="web-style"===a.type?await c(a,s):a.clone();const u=h(a,o);if(!("visualVariables"in n)||"visualVariables"in n&&!n.visualVariables||"visualVariables"in n&&!n.visualVariables?.length)return u;if(n.arcadeRequiredForVisualVariables&&(t(s)||t(s.arcade))){const e={...l(s)};e.arcade=await r(),s=e}const f=await import("../../renderers/visualVariables/support/visualVariableUtils.js"),p=[],d=[];for(const e of n.visualVariables)switch(e.type){case"color":p.push(e);break;case"opacity":d.push(e)}const m=p.length>0?p[p.length-1]:null,g=m?f.getColor(m,i,s):u,b=d.length>0?d[d.length-1]:null;let w=b?f.getOpacity(b,i,s):null;return null!=o&&(w=null!=w?w*o:o),g?y(g,w):null}export{L as getDisplayedColor,R as getDisplayedSymbol,x as renderColorRampPreviewHTML,S as renderDotDensityPreviewHTML,v as renderPieChartPreviewHTML,C as renderPreviewHTML,V as renderRelationshipRampPreviewHTML};