You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
14 lines
5.4 KiB
14 lines
5.4 KiB
// All material copyright Esri, All Rights Reserved, unless otherwise specified. |
|
// See https://js.arcgis.com/4.30/esri/copyright.txt for details. |
|
//>>built |
|
define(["../../core/screenUtils","../support/textUtils"],function(p,u){function t(c){return`rgba(${c.slice(0,3).toString()},${c[3]})`}function r(c,a){var d=a.font;d=`${d.style} ${d.weight} ${p.pt2px(Math.max(a.size,.5)*a.pixelRatio).toFixed(1)}px ${d.family}, sans-serif`;c.font=d;c.textBaseline="top";switch(a.horizontalAlignment){case "left":a="left";break;case "right":a="right";break;case "center":a="center";break;default:a="left"}c.textAlign=a}class v{constructor(c){c&&(this._textRasterizationCanvas= |
|
c)}rasterizeText(c,a){this._textRasterizationCanvas||(this._textRasterizationCanvas=document.createElement("canvas"));const d=this._textRasterizationCanvas;var b=d.getContext("2d",{willReadFrequently:!0});r(b,a);this._parameters=a;this._textLines=c.split(/\r?\n/);this._lineHeight=this._computeLineHeight();const {decoration:l,weight:m}=a.font;this._lineThroughWidthOffset=l&&"line-through"===l?.1*this._lineHeight:0;var e=(c=null!=a.backgroundColor||null!=a.borderLine)?u.backgroundPadding:0,f=this._computeTextWidth(b, |
|
a)+2*e,h=this._lineHeight*this._textLines.length+2*e;d.width=f+2*this._lineThroughWidthOffset;d.height=h;if(0===d.width||0===d.height)return d.width=d.height=1,{size:[0,0],image:new Uint32Array(0),sdf:!1,simplePattern:!1,anchorX:0,anchorY:0,canvas:d};this._renderedLineHeight=Math.round(this._lineHeight*a.pixelRatio);this._renderedHaloSize=p.pt2px(a.halo.size)*a.pixelRatio;this._renderedWidth=f*a.pixelRatio;this._renderedHeight=h*a.pixelRatio;this._lineThroughWidthOffset*=a.pixelRatio;f=a.halo&&a.halo.color? |
|
a.halo.color:[0,0,0,0];this._fillStyle=t(a.color??[0,0,0,0]);this._haloStyle=`rgb(${f.slice(0,3).toString()})`;f=this._renderedLineHeight;var g=this._renderedHaloSize;b.save();b.clearRect(0,0,d.width,d.height);r(b,a);h=e*a.pixelRatio;e=b.textAlign;var k=this._renderedWidth-2*h;e=("center"===e?.5*k:"right"===e?k:0)+g+h;h=g+h;g=0<g;k=this._lineThroughWidthOffset;let n=0;if(c){b.save();c=a.backgroundColor??[0,0,0,0];const w=a.borderLine?.color??[0,0,0,0],x=2*p.pt2px(a.borderLine?.size??0);b.fillStyle= |
|
t(c);b.strokeStyle=t(w);b.lineWidth=x;b.fillRect(0,0,d.width,d.height);b.strokeRect(0,0,d.width,d.height);b.restore()}g&&this._renderHalo(b,e,h,k,n,a);n+=h;k+=e;for(var q of this._textLines)g&&(b.globalCompositeOperation="destination-out",b.fillStyle="rgb(0, 0, 0)",b.fillText(q,k,n),b.globalCompositeOperation="source-over"),b.fillStyle=this._fillStyle,b.fillText(q,k,n),l&&"none"!==l&&this._renderDecoration(b,k,n,l,m),n+=f;b.restore();q=this._renderedWidth+2*this._lineThroughWidthOffset;c=this._renderedHeight; |
|
b=b.getImageData(0,0,q,c);b=new Uint8Array(b.data);if(a.premultiplyColors)for(e=0;e<b.length;e+=4)f=b[e+3]/255,b[e]*=f,b[e+1]*=f,b[e+2]*=f;switch(a.horizontalAlignment){case "left":f=-.5;break;case "right":f=.5;break;default:f=0}switch(a.verticalAlignment){case "bottom":a=-.5;break;case "top":a=.5;break;case "baseline":a=-1/6;break;default:a=0}return{size:[q,c],image:new Uint32Array(b.buffer),sdf:!1,simplePattern:!1,anchorX:f,anchorY:a,canvas:d}}_renderHalo(c,a,d,b,l,m){const e=this._renderedWidth, |
|
f=this._renderedHeight;this._haloRasterizationCanvas||(this._haloRasterizationCanvas=document.createElement("canvas"));this._haloRasterizationCanvas.width=e;this._haloRasterizationCanvas.height=f;const h=this._haloRasterizationCanvas,g=h.getContext("2d");g.clearRect(0,0,e,f);r(g,m);const {decoration:k,weight:n}=m.font;g.fillStyle=this._haloStyle;g.strokeStyle=this._haloStyle;g.lineJoin="round";this._renderHaloNative(g,a,d,k,n);c.globalAlpha=this._parameters.halo.color[3];c.drawImage(h,0,0,e,f,b,l, |
|
e,f);c.globalAlpha=1}_renderHaloNative(c,a,d,b,l){const m=this._renderedLineHeight,e=this._renderedHaloSize;for(const f of this._textLines){const h=2*e;for(let g=0;5>g;g++){const k=(.6+.1*g)*h;c.lineWidth=k;c.strokeText(f,a,d);b&&"none"!==b&&this._renderDecoration(c,a,d,b,l,k)}d+=m}}computeTextSize(c,a){this._textRasterizationCanvas||(this._textRasterizationCanvas=document.createElement("canvas"));const d=this._textRasterizationCanvas;var b=d.getContext("2d");r(b,a);this._parameters=a;this._textLines= |
|
c.split(/\r?\n/);this._lineHeight=this._computeLineHeight();c=this._computeTextWidth(b,a);b=this._lineHeight*this._textLines.length;d.width=c;d.height=b;return[c*a.pixelRatio,b*a.pixelRatio]}_computeTextWidth(c,a){let d=0;for(const b of this._textLines)d=Math.max(d,c.measureText(b).width);a=a.font;if("italic"===a.style||"oblique"===a.style||"string"===typeof a.weight&&("bold"===a.weight||"bolder"===a.weight)||"number"===typeof a.weight&&600<a.weight)d+=.3*c.measureText("w").width;d+=2*p.pt2px(this._parameters.halo.size); |
|
return Math.round(d)}_computeLineHeight(){let c=1.275*this._parameters.size;const a=this._parameters.font.decoration;a&&"underline"===a&&(c*=1.3);return Math.round(c+2*p.pt2px(this._parameters.halo.size))}_renderDecoration(c,a,d,b,l,m){const e=.9*this._lineHeight;switch(c.textAlign){case "center":a-=this._renderedWidth/2;break;case "right":a-=this._renderedWidth}const f=c.textBaseline;if("underline"===b)switch(f){case "top":d+=e;break;case "middle":d+=e/2}else if("line-through"===b)switch(f){case "top":d+= |
|
e/1.5;break;case "middle":d+=e/3}b=m?1.5*m:Math.ceil(e*("bold"===l?.06:"bolder"===l?.09:.04));c.save();c.beginPath();c.strokeStyle=c.fillStyle;c.lineWidth=b;c.moveTo(a-this._lineThroughWidthOffset,d);c.lineTo(a+this._renderedWidth+2*this._lineThroughWidthOffset,d);c.stroke();c.restore()}}return v}); |