ue-too
Version:
pan, zoom, and rotate your html canvas
1 lines • 90.7 kB
JavaScript
import{PointCal as t}from"point2point";const e=()=>{};class i{constructor(t,e,i){this._timeouts=void 0,this._states=t,this._currentState=e,this._context=i,this._statesArray=Object.keys(t),this._stateChangeCallbacks=[],this._happensCallbacks=[]}switchTo(t){this._currentState=t}happens(t,e){this._timeouts&&clearTimeout(this._timeouts),this._happensCallbacks.forEach((i=>i(t,e,this._context)));const i=this._states[this._currentState].handles(t,e,this._context,this);if(void 0!==i&&i!==this._currentState){const t=this._currentState;this._states[this._currentState].beforeExit(this._context,this,i),this.switchTo(i),this._states[this._currentState].uponEnter(this._context,this,t),this._stateChangeCallbacks.forEach((e=>e(t,this._currentState)))}return i}onStateChange(t){this._stateChangeCallbacks.push(t)}onHappens(t){this._happensCallbacks.push(t)}get currentState(){return this._currentState}setContext(t){this._context=t}get possibleStates(){return this._statesArray}get states(){return this._states}}class o{constructor(){this._guards={},this._eventGuards={},this._delay=void 0}get guards(){return this._guards}get eventGuards(){return this._eventGuards}get delay(){return this._delay}uponEnter(t,e,i){}beforeExit(t,e,i){}handles(t,e,i,o){if(this.eventReactions[t]){this.eventReactions[t].action(i,e,o);const n=this.eventReactions[t].defaultTargetState,a=this._eventGuards[t];if(a){const t=a.find((t=>!!this.guards[t.guard]&&this.guards[t.guard](i)));return t?t.target:n}return n}}}function n(t){return void 0===t||!(void 0!==t.min&&void 0!==t.max&&t.min>t.max)}function a(t,e){return s(t,e)||void 0===e||(e.max&&(t=Math.min(e.max,t)),e.min&&(t=Math.max(e.min,t))),t}function s(t,e){return void 0===e||!(t<=0||void 0!==e&&(void 0!==e.max&&e.max<t||void 0!==e.min&&e.min>t))}function r(t,e,i,o){const n=t.a,a=t.b;t.c,t.d;const s=t.e,r=t.f,h=-Math.atan2(a,n),c=Math.sqrt(n*n+a*a)/e;let l=[s,r];l=[l[0]/e,l[1]/e],l=[l[0]-i/2,l[1]-o/2];const u=Math.cos(h),d=Math.sin(h);l=[u*l[0]-d*l[1],d*l[0]+u*l[1]],l=[l[0]/c,l[1]/c];return{position:{x:-l[0],y:-l[1]},zoom:c,rotation:h}}function h(t,e,i,o,n,a){const s=c({a:o,b:0,c:0,d:o,e:0,f:0},{a:1,b:0,c:0,d:1,e:n/2,f:a/2}),r=Math.cos(-i),h=Math.sin(-i),l=c(s,{a:r,b:h,c:-h,d:r,e:0,f:0}),u=c(l,{a:e,b:0,c:0,d:e,e:0,f:0});return c(u,{a:1,b:0,c:0,d:1,e:-t.x,f:-t.y})}function c(t,e){const i=t.a,o=t.b,n=t.c,a=t.d,s=t.e,r=t.f,h=e.a,c=e.b,l=e.c,u=e.d,d=e.e,m=e.f;return{a:i*h+n*c,b:o*h+a*c,c:i*l+n*u,d:o*l+a*u,e:i*d+n*m+s,f:o*d+a*m+r}}function l(e,i,o,n,a,s){let r={x:o/2,y:n/2},h=t.subVector(i,r);return h=t.multiplyVectorByScalar(h,1/a),h=t.rotatePoint(h,s),t.addVector(e,h)}function u(e,i,o,n,a,s){let r={x:i/2,y:o/2},h=t.subVector(e,r);return h=t.multiplyVectorByScalar(h,1/a),h=t.rotatePoint(h,s),t.addVector(n,h)}function d(e,i,o,n){const a=t.multiplyVectorByScalar(e,1/o),s=t.rotatePoint(a,n);return t.addVector(s,i)}function m(e,i,o,n){const a=t.subVector(e,i),s=t.multiplyVectorByScalar(a,o);return t.rotatePoint(s,-n)}function _(e,i,o,n,a,s){let r={x:i/2,y:o/2},h=t.subVector(e,n);return h=t.rotatePoint(h,-s),h=t.multiplyVectorByScalar(h,a),t.addVector(r,h)}function p(t,e,i,o,n,a){const s=_(t,e,i,o,n,a);return!(s.x<0||s.x>e||s.y<0||s.y>i)}function y(e,i,o){return t.multiplyVectorByScalar(t.rotatePoint(e,o),1/i)}function f(e,i,o){return t.multiplyVectorByScalar(t.rotatePoint(e,-o),i)}function v(e,i,o,n){const a=t.multiplyVectorByScalar(i,1/o),s=t.rotatePoint(a,n);return t.subVector(e,s)}function g(t,e,i){const o=Math.cos(i),n=Math.sin(i),a=c({a:1,b:0,c:0,d:1,e:t.x,f:t.y},{a:o,b:n,c:-n,d:o,e:0,f:0});return c(a,{a:1/e,b:0,c:0,d:1/e,e:0,f:0})}function P(t,e){return{x:t.x*e.a+t.y*e.c+e.e,y:t.x*e.b+t.y*e.d+e.f}}function x(t,e){if(null==e)return!0;let i=!1,o=!1,n=!1,a=!1;return(null==e.max||null==e.max.x||t.x<=e.max.x)&&(o=!0),(null==e.min||null==e.min.x||t.x>=e.min.x)&&(i=!0),(null==e.max||null==e.max.y||t.y<=e.max.y)&&(n=!0),(null==e.min||null==e.min.y||t.y>=e.min.y)&&(a=!0),i&&o&&n&&a}function b(t){var e,i,o,n;if(null==t)return!0;const a=null===(e=t.min)||void 0===e?void 0:e.x,s=null===(i=t.max)||void 0===i?void 0:i.x;if(null!=a&&null!=s&&a>=s)return!1;const r=null===(o=t.min)||void 0===o?void 0:o.y,h=null===(n=t.max)||void 0===n?void 0:n.y;return!(null!=r&&null!=h&&r>=h)}function T(t){return null!=t&&(null!=t.max&&null!=t.min&&(null!=t.max.x&&null!=t.max.y&&null!=t.min.x&&null!=t.min.y))}function w(t,e){if(x(t,e)||null==e)return t;let i={x:t.x,y:t.y},o=e.min;return null!=o&&(null!=o.x&&(i.x=Math.max(i.x,o.x)),null!=o.y&&(i.y=Math.max(i.y,o.y))),o=e.max,null!=o&&(null!=o.x&&(i.x=Math.min(i.x,o.x)),null!=o.y&&(i.y=Math.min(i.y,o.y))),i}function C(t){if(null!=t&&null!=t.min&&null!=t.max&&null!=t.min.x&&null!=t.max.x)return t.max.x-t.min.x}function B(t){const e=C(t);return null!=e?e/2:void 0}function I(t){if(null!=t&&null!=t.min&&null!=t.max&&null!=t.min.y&&null!=t.max.y)return t.max.y-t.min.y}function R(t){const e=I(t);return null!=e?e/2:void 0}function S(e,i,o,n,a,s){if(null==n)return e;let r=l(e,{x:0,y:o},i,o,a,s),h=l(e,{x:0,y:0},i,o,a,s),c=l(e,{x:i,y:o},i,o,a,s),u=l(e,{x:i,y:0},i,o,a,s),d=w(r,n),m=w(c,n),_=w(h,n),p=w(u,n),y=[t.subVector(d,r),t.subVector(m,c),t.subVector(_,h),t.subVector(p,u)],f=Math.abs(y[0].x),v=Math.abs(y[0].y),g=y[0];return y.forEach((t=>{Math.abs(t.x)>f&&(f=Math.abs(t.x),g.x=t.x),Math.abs(t.y)>v&&(v=Math.abs(t.y),g.y=t.y)})),t.addVector(e,g)}function M(t,e){if(O(t,e)||void 0===e)return t;t=z(t);const i=V(e.start,t),o=V(e.end,t);if(e.ccw&&(i<0||o>0)||!e.ccw&&(i>0||o<0)){if(Math.abs(i)===Math.abs(o))return e.startAsTieBreaker?e.start:e.end;return Math.abs(i)<Math.abs(o)?e.start:e.end}return t}function O(t,e){if(void 0===e)return!0;if(z(e.start)===z(e.end))return!0;if(z(e.start+.01)===z(e.end+.01))return!0;const i=z(t),o=V(e.start,i),n=V(e.end,i);return!(e.ccw&&(o<0||n>0)||!e.ccw&&(o>0||n<0))}function A(t,e){if(z(e.start)===z(e.end))return!0;if(z(e.start+.01)===z(e.end+.01))return!0;let i=z(t)-z(e.start);i<0&&(i+=2*Math.PI),!e.positiveDirection&&i>0&&(i=2*Math.PI-i);let o=z(e.end)-z(e.start);return o<0&&(o+=2*Math.PI),!e.positiveDirection&&o>0&&(o=2*Math.PI-o),o>=i}function z(t){return t=((t%=2*Math.PI)+2*Math.PI)%(2*Math.PI)}function V(t,e){t=z(t);let i=(e=z(e))-t;return i>Math.PI&&(i=-(2*Math.PI-i)),i<-Math.PI&&(i+=2*Math.PI),i}function E(t){return t*Math.PI/180}function k(t){return 180*t/Math.PI}class H{constructor(){this.observers=[]}subscribe(t,e){if(this.observers.push(t),null==e?void 0:e.signal){if(e.signal.aborted)return this.observers=this.observers.filter((e=>e!==t)),()=>{};const i=()=>{var o;this.observers=this.observers.filter((e=>e!==t)),null===(o=e.signal)||void 0===o||o.removeEventListener("abort",i)};e.signal.addEventListener("abort",i)}return()=>{this.observers=this.observers.filter((e=>e!==t))}}notify(...t){this.observers.forEach((e=>queueMicrotask((()=>e(...t)))))}}class L{constructor(){this.pan=new H,this.zoom=new H,this.rotate=new H,this.all=new H}notifyPan(t,e){this.pan.notify(t,e),this.all.notify({type:"pan",diff:t.diff},e)}notifyZoom(t,e){this.zoom.notify(t,e),this.all.notify({type:"zoom",deltaZoomAmount:t.deltaZoomAmount},e)}notifyRotate(t,e){this.rotate.notify(t,e),this.all.notify({type:"rotate",deltaRotation:t.deltaRotation},e)}on(t,e,i){switch(t){case"pan":return this.pan.subscribe(e,i);case"zoom":return this.zoom.subscribe(e,i);case"rotate":return this.rotate.subscribe(e,i);case"all":return this.all.subscribe(e,i);default:throw new Error(`Invalid event name: ${t}`)}}}class Z{constructor(t=1e3,e=1e3,i={x:0,y:0},o=0,n=1,a={min:{x:-1e4,y:-1e4},max:{x:1e4,y:1e4}},s={min:.1,max:10},r=void 0){this._position=i,this._zoomLevel=n,this._rotation=o,this._viewPortHeight=e,this._viewPortWidth=t,this._zoomBoundaries=s,this._rotationBoundaries=r,this._boundaries=a}get boundaries(){return this._boundaries}set boundaries(t){this._boundaries=t}get viewPortWidth(){return this._viewPortWidth}set viewPortWidth(t){this._viewPortWidth=t}get viewPortHeight(){return this._viewPortHeight}set viewPortHeight(t){this._viewPortHeight=t}get position(){return this._position}setPosition(e){if(!x(e,this._boundaries))return!1;const i=t.subVector(e,this._position);return!(t.magnitude(i)<1e-9&&t.magnitude(i)<1/this._zoomLevel)&&(this._position=e,!0)}get zoomLevel(){return this._zoomLevel}get zoomBoundaries(){return this._zoomBoundaries}set zoomBoundaries(t){if(void 0!==t&&void 0!==t.min&&void 0!==t.max&&t.min>t.max){let e=t.max;t.max=t.min,t.min=e}this._zoomBoundaries=t}setMaxZoomLevel(t){return null==this._zoomBoundaries&&(this._zoomBoundaries={min:void 0,max:void 0}),!(null!=this._zoomBoundaries.min&&this._zoomBoundaries.min>t||this._zoomLevel>t)&&(this._zoomBoundaries.max=t,!0)}setMinZoomLevel(t){return null==this._zoomBoundaries&&(this._zoomBoundaries={min:void 0,max:void 0}),!(null!=this._zoomBoundaries.max&&this._zoomBoundaries.max<t)&&(this._zoomBoundaries.min=t,this._zoomLevel<t&&(this._zoomLevel=t),!0)}setZoomLevel(t){return!!s(t,this._zoomBoundaries)&&((void 0===this._zoomBoundaries||void 0===this._zoomBoundaries.max||a(t,this._zoomBoundaries)!=this._zoomBoundaries.max||this._zoomLevel!=this._zoomBoundaries.max)&&((void 0===this._zoomBoundaries||void 0===this._zoomBoundaries.min||a(t,this._zoomBoundaries)!=this._zoomBoundaries.min||this._zoomLevel!=this._zoomBoundaries.min)&&(this._zoomLevel=t,!0)))}get rotation(){return this._rotation}get rotationBoundaries(){return this._rotationBoundaries}set rotationBoundaries(t){if(void 0!==t&&void 0!==t.start&&void 0!==t.end&&t.start>t.end){let e=t.end;t.end=t.start,t.start=e}this._rotationBoundaries=t}getTransform(t,e){if(void 0!==this.currentCachedTransform&&this.currentCachedTransform.devicePixelRatio===t&&this.currentCachedTransform.alignCoorindate===e&&this.currentCachedTransform.position.x===this._position.x&&this.currentCachedTransform.position.y===this._position.y&&this.currentCachedTransform.rotation===this._rotation&&this.currentCachedTransform.zoomLevel===this._zoomLevel&&this.currentCachedTransform.viewPortWidth===this._viewPortWidth&&this.currentCachedTransform.viewPortHeight===this._viewPortHeight)return Object.assign(Object.assign({},this.currentCachedTransform.transform),{cached:!0});const i=t*this._viewPortWidth/2,o=t*this._viewPortHeight/2,n=-this._position.x,a=e?-this._position.y:this._position.y,s=t,r=this._zoomLevel,h=e?-this._rotation:this._rotation,c=Math.sin(h),l=Math.cos(h),u=r*s*l,d=r*s*c,m=-s*r*c,_=r*s*l,p=s*r*l*n-s*r*c*a+i,y=s*r*c*n+s*r*l*a+o;return this.currentCachedTransform={transform:{a:u,b:d,c:m,d:_,e:p,f:y},position:this._position,rotation:this._rotation,zoomLevel:this._zoomLevel,alignCoorindate:e,devicePixelRatio:t,viewPortWidth:this._viewPortWidth,viewPortHeight:this._viewPortHeight},{a:u,b:d,c:m,d:_,e:p,f:y,cached:!1}}setUsingTransformationMatrix(t){const e=r(t,this._viewPortWidth,this._viewPortHeight,this._zoomLevel);this.setPosition(e.position),this.setRotation(e.rotation),this.setZoomLevel(e.zoom)}setRotation(t){return!!O(t,this._rotationBoundaries)&&(t=z(t),(void 0===this._rotationBoundaries||void 0===this._rotationBoundaries.end||M(t,this._rotationBoundaries)!=this._rotationBoundaries.end||this._rotation!=this._rotationBoundaries.end)&&((void 0===this._rotationBoundaries||void 0===this.rotationBoundaries.start||M(t,this._rotationBoundaries)!=this._rotationBoundaries.start||this._rotation!=this._rotationBoundaries.start)&&(this._rotation=t,!0)))}getCameraOriginInWindow(t){return t}convertFromViewPort2WorldSpace(t){return d(t,this._position,this._zoomLevel,this._rotation)}convertFromWorld2ViewPort(t){return m(t,this._position,this._zoomLevel,this._rotation)}invertFromWorldSpace2ViewPort(e){let i={x:this.viewPortWidth/2,y:this._viewPortHeight/2},o=t.subVector(e,this._position);return o=t.rotatePoint(o,-this._rotation),o=t.multiplyVectorByScalar(o,this._zoomLevel),t.addVector(i,o)}setHorizontalBoundaries(t,e){if(t>e){let i=e;e=t,t=i}null==this._boundaries&&(this._boundaries={min:{x:void 0,y:void 0},max:{x:void 0,y:void 0}}),this._boundaries.min.x=t,this._boundaries.max.x=e}setVerticalBoundaries(t,e){if(t>e){let i=e;e=t,t=i}null==this._boundaries&&(this._boundaries={min:{x:void 0,y:void 0},max:{x:void 0,y:void 0}}),this._boundaries.min.y=t,this._boundaries.max.y=e}}const U=1e3,N=1e3,W={min:.1,max:10},D={min:{x:-1e4,y:-1e4},max:{x:1e4,y:1e4}},F=void 0;class j{constructor(t=1e3,e=1e3,i={x:0,y:0},o=0,n=1,a=D,s=W,r=F){this._baseCamera=new Z(t,e,i,o,n,a,s,r),this._observer=new L}get boundaries(){return this._baseCamera.boundaries}set boundaries(t){this._baseCamera.boundaries=t}get viewPortWidth(){return this._baseCamera.viewPortWidth}set viewPortWidth(t){this._baseCamera.viewPortWidth=t}get viewPortHeight(){return this._baseCamera.viewPortHeight}set viewPortHeight(t){this._baseCamera.viewPortHeight=t}get position(){return this._baseCamera.position}setPosition(e){const i=Object.assign({},this._baseCamera.position);return!!this._baseCamera.setPosition(e)&&(this._observer.notifyPan({diff:t.subVector(e,i)},{position:this._baseCamera.position,rotation:this._baseCamera.rotation,zoomLevel:this._baseCamera.zoomLevel}),!0)}get zoomLevel(){return this._baseCamera.zoomLevel}get zoomBoundaries(){return this._baseCamera.zoomBoundaries}set zoomBoundaries(t){this._baseCamera.zoomBoundaries=t}setMaxZoomLevel(t){const e=this._baseCamera.zoomLevel;return!!this._baseCamera.setMaxZoomLevel(t)&&(this._observer.notifyZoom({deltaZoomAmount:t-e},{position:this._baseCamera.position,rotation:this._baseCamera.rotation,zoomLevel:this._baseCamera.zoomLevel}),!0)}setMinZoomLevel(t){return!!this._baseCamera.setMinZoomLevel(t)}setZoomLevel(t){return!!this._baseCamera.setZoomLevel(t)}get rotation(){return this._baseCamera.rotation}get rotationBoundaries(){return this._baseCamera.rotationBoundaries}set rotationBoundaries(t){this._baseCamera.rotationBoundaries=t}getTransform(t,e){return this._baseCamera.getTransform(t,e)}setRotation(t){const e=this._baseCamera.rotation;return!!this._baseCamera.setRotation(t)&&(this._observer.notifyRotate({deltaRotation:t-e},{position:this._baseCamera.position,rotation:this._baseCamera.rotation,zoomLevel:this._baseCamera.zoomLevel}),!0)}getCameraOriginInWindow(t){return t}convertFromViewPort2WorldSpace(t){return d(t,this._baseCamera.position,this._baseCamera.zoomLevel,this._baseCamera.rotation)}convertFromWorld2ViewPort(t){return m(t,this._baseCamera.position,this._baseCamera.zoomLevel,this._baseCamera.rotation)}invertFromWorldSpace2ViewPort(e){let i={x:this._baseCamera.viewPortWidth/2,y:this._baseCamera.viewPortHeight/2},o=t.subVector(e,this._baseCamera.position);return o=t.rotatePoint(o,-this._baseCamera.rotation),o=t.multiplyVectorByScalar(o,this._baseCamera.zoomLevel),t.addVector(i,o)}setHorizontalBoundaries(t,e){if(t>e){let i=e;e=t,t=i}null==this._baseCamera.boundaries&&(this._baseCamera.boundaries={min:{x:void 0,y:void 0},max:{x:void 0,y:void 0}}),this._baseCamera.boundaries.min.x=t,this._baseCamera.boundaries.max.x=e}setVerticalBoundaries(t,e){if(t>e){let i=e;e=t,t=i}null==this._baseCamera.boundaries&&(this._baseCamera.boundaries={min:{x:void 0,y:void 0},max:{x:void 0,y:void 0}}),this._baseCamera.boundaries.min.y=t,this._baseCamera.boundaries.max.y=e}on(t,e,i){return this._observer.on(t,e,i)}}class q{constructor(e={x:0,y:0},i=0,o=1,n=1e3,a=1e3,s=new L,r={min:{x:-1e4,y:-1e4},max:{x:1e4,y:1e4}},h={min:.1,max:10},c={start:0,end:2*Math.PI,ccw:!0,startAsTieBreaker:!1}){this._contextRotation=-i,this._zoomLevel=o,this._contextPosition=t.subVector({x:n/2,y:a/2},t.multiplyVectorByScalar(t.rotatePoint(e,-i),o)),this._viewPortWidth=n,this._viewPortHeight=a,this._observer=s,this._boundaries=r,this._rotationBoundaries=c,this._zoomBoundaries=h}get position(){const e=(this._viewPortWidth/2-this._contextPosition.x)/this._zoomLevel,i=(this._viewPortHeight/2-this._contextPosition.y)/this._zoomLevel;return t.rotatePoint({x:e,y:i},-this._contextRotation)}get contextTransform(){return{position:this._contextPosition,rotation:this._contextRotation,zoomLevel:this._zoomLevel}}setPosition(e){if(x(e,this._boundaries)){const i=t.subVector({x:this._viewPortWidth/2,y:this._viewPortHeight/2},t.multiplyVectorByScalar(t.rotatePoint(e,-this.rotation),this._zoomLevel));this._contextPosition=i}}setPositionByDelta(e){const i=t.addVector(this.position,e);this.setPosition(i)}setPositionWithUserInputDelta(e){this._contextPosition=t.addVector(this._contextPosition,e)}getCameraOriginInWindow(t){return{x:t.x-this._viewPortWidth/2,y:t.y-this._viewPortHeight/2}}convertFromViewPort2WorldSpace(e){const i={x:e.x+this._viewPortWidth/2,y:e.y+this._viewPortHeight/2};return t.multiplyVectorByScalar(t.rotatePoint(t.subVector(i,this._contextPosition),-this._contextRotation),1/this._zoomLevel)}setZoomLevel(t){s(t,this._zoomBoundaries)&&(this._zoomLevel,this._zoomLevel=t)}setRotation(t){const e=-t;O(e,this._rotationBoundaries)&&(this._contextRotation=e)}get zoomLevel(){return this._zoomLevel}get rotation(){return-this._contextRotation}getTransform(t,e,i,o){const n=this._contextPosition.x*i,a=this._contextPosition.y*i,s=-Math.sin(this._contextRotation)*this._zoomLevel*i;return{a:this._zoomLevel*Math.cos(this._contextRotation)*i,b:Math.sin(this._contextRotation)*this._zoomLevel*i,c:s,d:this._zoomLevel*Math.cos(this._contextRotation)*i,e:n,f:a}}get viewPortWidth(){return this._viewPortWidth}get viewPortHeight(){return this._viewPortHeight}set viewportWidth(t){this._viewPortWidth=t}set viewportHeight(t){this._viewPortHeight=t}get zoomBoundaries(){return this._zoomBoundaries}get rotationBoundaries(){return this._rotationBoundaries}viewPortDelta2WorldDelta(t){return t}setMinZoomLevel(t){return null==this._zoomBoundaries&&(this._zoomBoundaries={min:void 0,max:void 0}),!(null!=this._zoomBoundaries.max&&this._zoomBoundaries.max<t)&&(this._zoomBoundaries.min=t,this._zoomLevel<t&&(this._zoomLevel=t),this._zoomBoundaries.min=t,!0)}setHorizontalBoundaries(t,e){this._boundaries.min.x=t,this._boundaries.max.x=e}setVerticalBoundaries(t,e){this._boundaries.min.y=t,this._boundaries.max.y=e}on(t,e){return this._observer.on(t,e)}set viewPortWidth(t){this._viewPortWidth=t}set viewPortHeight(t){this._viewPortHeight=t}}function Y(...t){const e=Array.isArray(t[0])?t[0]:t;return(t,...i)=>e.reduce(((t,e)=>e(t,...i)),t)}function G(){return Y(K,J)}function X(){return Y($,Q)}function K(e,i,o){let n=t.subVector(e,i.position);if(n=tt(n,i,o),0===n.x&&0===n.y)return e;return t.addVector(i.position,n)}function $(t,e,i){return t=tt(t,e,i)}function J(t,e,i){if(!i.clampTranslation)return t;let o=w(t,e.boundaries);return i.limitEntireViewPort&&(o=S(t,e.viewPortWidth,e.viewPortHeight,e.boundaries,e.zoomLevel,e.rotation)),o}function Q(e,i,o){if(!o.clampTranslation)return e;let n=t.subVector(w(t.addVector(i.position,e),i.boundaries),i.position);return o.limitEntireViewPort&&(n=t.subVector(S(t.addVector(i.position,e),i.viewPortWidth,i.viewPortHeight,i.boundaries,i.zoomLevel,i.rotation),i.position)),n}function tt(e,i,o){if(o.restrictXTranslation&&o.restrictYTranslation)return{x:0,y:0};if(o.restrictRelativeXTranslation&&o.restrictRelativeYTranslation)return{x:0,y:0};if(o.restrictXTranslation&&(e.x=0),o.restrictYTranslation&&(e.y=0),o.restrictRelativeXTranslation){const o=t.rotatePoint({x:0,y:1},i.rotation),n=t.dotProduct(o,e);e=t.multiplyVectorByScalar(o,n)}if(o.restrictRelativeYTranslation){const o=t.rotatePoint({x:1,y:0},i.rotation),n=t.dotProduct(o,e);e=t.multiplyVectorByScalar(o,n)}return e}function et(e,i){return t.multiplyVectorByScalar(t.rotatePoint(e,i.rotation),1/i.zoomLevel)}function it(t,e,i){return i.clampZoom?a(t,e.zoomBoundaries):t}function ot(t,e,i){if(!i.clampZoom)return t;let o=e.zoomLevel+t;return o=a(o,e.zoomBoundaries),t=o-e.zoomLevel}function nt(t,e,i){return i.restrictZoom?e.zoomLevel:t}function at(t,e,i){return i.restrictZoom?0:t}function st(){return Y(it,nt)}function rt(){return Y(ot,at)}function ht(t,e,i){if(!i.clampRotation)return t;const o=M(z(e.rotation+t),e.rotationBoundaries);return V(e.rotation,o)}function ct(t,e,i){return i.restrictRotation?0:t}function lt(t,e,i){if(!i.clampRotation)return t;return M(t,e.rotationBoundaries)}function ut(t,e,i){return i.restrictRotation?e.rotation:t}function dt(){return Y(ct,ht)}function mt(){return Y(ut,lt)}class _t{constructor(){this.nextPosition=null,this.delta={x:0,y:0},this.queuePositionUpdateCount=0,this.queuePositionUpdateToCount=0,this.queuePositionUpdateByCount=0,this.lastUpdateCount=0,this.observable=new H}queuePositionUpdate(t,e){this.queuePositionUpdateCount++,this.queuePositionUpdateTo({x:t,y:e})}queuePositionUpdateTo(t){this.queuePositionUpdateToCount++,this.nextPosition=Object.assign({},t),this.delta={x:0,y:0}}queuePositionUpdateBy(t){this.queuePositionUpdateByCount++,null===this.nextPosition?this.delta={x:this.delta.x+t.x,y:this.delta.y+t.y}:this.nextPosition={x:this.nextPosition.x+t.x,y:this.nextPosition.y+t.y}}processQueuedUpdates(){if(this.lastUpdateCount=this.queuePositionUpdateCount+this.queuePositionUpdateToCount+this.queuePositionUpdateByCount,this.queuePositionUpdateCount=0,this.queuePositionUpdateToCount=0,this.queuePositionUpdateByCount=0,null!==this.nextPosition){const t=Object.assign(Object.assign({},this.nextPosition),{type:"destination"});return this.nextPosition=null,this.delta={x:0,y:0},this.observable.notify(t),t}if(0!==this.delta.x||0!==this.delta.y){const t=Object.assign(Object.assign({},this.delta),{type:"delta"});return this.delta={x:0,y:0},this.observable.notify(t),t}return null}subscribe(t,e){return this.observable.subscribe(t,e)}getDebugInfo(){return{lastUpdateTotalCalls:this.lastUpdateCount,queuePositionUpdateCalls:this.queuePositionUpdateCount,queuePositionUpdateToCalls:this.queuePositionUpdateToCount,queuePositionUpdateByCalls:this.queuePositionUpdateByCount}}}class pt{constructor(){this.nextZoom=null,this.anchor=null,this.delta=0,this.anchorCoordinateSystem="viewport",this.queueZoomUpdateCount=0,this.queueZoomUpdateToCount=0,this.lastUpdateCount=0,this.observable=new H}queueZoomUpdateTo(t,e){"world"===this.anchorCoordinateSystem&&(this.anchorCoordinateSystem="viewport",this.nextZoom=null,this.delta=0),this.anchor=e,this.nextZoom=t,0!==this.delta&&(this.delta=0)}queueZoomUpdateBy(t,e){"world"===this.anchorCoordinateSystem&&(this.anchorCoordinateSystem="viewport",this.nextZoom=null,this.delta=0),null===this.nextZoom?this.delta+=t:this.nextZoom+=t,this.anchor=e}queueZoomByAtWorld(t,e){"viewport"===this.anchorCoordinateSystem&&(this.anchorCoordinateSystem="world",this.nextZoom=null,this.delta=0),this.anchor=e,null===this.nextZoom?this.delta+=t:this.nextZoom+=t}queueZoomToAtWorld(t,e){"viewport"===this.anchorCoordinateSystem&&(this.anchorCoordinateSystem="world",this.nextZoom=null,this.delta=0),this.anchor=e,this.nextZoom=t,0!==this.delta&&(this.delta=0)}processQueuedUpdates(){if(null===this.nextZoom&&0===this.delta)return null;const t=this.delta,e=this.nextZoom,i=this.anchor;return this.delta=0,this.nextZoom=null,this.anchor=null,0!==t?{anchorCoordinateSystem:this.anchorCoordinateSystem,update:{type:"delta",delta:t,anchor:i}}:{anchorCoordinateSystem:this.anchorCoordinateSystem,update:{type:"destination",destination:e,anchor:i}}}subscribe(t,e){return this.observable.subscribe(t,e)}getDebugInfo(){return{lastUpdateTotalCalls:this.lastUpdateCount,queueZoomUpdateCalls:this.queueZoomUpdateCount,queueZoomUpdateToCalls:this.queueZoomUpdateToCount}}}class yt{constructor(){this.nextRotation=null,this.delta=0,this.queueRotationUpdateCount=0,this.queueRotationUpdateToCount=0,this.queueRotationUpdateByCount=0,this.lastUpdateCount=0,this.observable=new H}queueRotationUpdate(t){this.queueRotationUpdateCount++,this.queueRotationUpdateTo(t)}queueRotationUpdateTo(t){this.queueRotationUpdateToCount++,this.nextRotation=t,this.delta=0}queueRotationUpdateBy(t){this.queueRotationUpdateByCount++,null===this.nextRotation?this.delta=this.delta+t:this.nextRotation=this.nextRotation+t}processQueuedUpdates(){if(this.lastUpdateCount=this.queueRotationUpdateCount+this.queueRotationUpdateToCount+this.queueRotationUpdateByCount,this.queueRotationUpdateCount=0,this.queueRotationUpdateToCount=0,this.queueRotationUpdateByCount=0,null!==this.nextRotation){const t={destination:this.nextRotation,type:"destination"};return this.nextRotation=null,this.delta=0,this.observable.notify(t),t}if(0!==this.delta){const t={delta:this.delta,type:"delta"};return this.delta=0,this.observable.notify(t),t}return null}subscribe(t,e){return this.observable.subscribe(t,e)}getDebugInfo(){return{lastUpdateTotalCalls:this.lastUpdateCount,queueRotationUpdateCalls:this.queueRotationUpdateCount,queueRotationUpdateToCalls:this.queueRotationUpdateToCount,queueRotationUpdateByCalls:this.queueRotationUpdateByCount}}}class ft{constructor(t,e=new j){this._panBy=X(),this._panTo=G(),this._zoomTo=st(),this._zoomBy=rt(),this._rotateBy=dt(),this._rotateTo=mt(),this._config=Object.assign(Object.assign({},t),{restrictRotation:!1,clampRotation:!0}),this._camera=e,this._positionBatcher=new _t,this._zoomBatcher=new pt,this._rotationBatcher=new yt}zoomToAt(t,e){this._zoomBatcher.queueZoomUpdateTo(t,e)}zoomByAt(t,e){this._zoomBatcher.queueZoomUpdateBy(t,e)}zoomTo(t){this._zoomBatcher.queueZoomUpdateTo(t)}zoomBy(t){this._zoomBatcher.queueZoomUpdateBy(t)}zoomToAtWorld(t,e){this._zoomBatcher.queueZoomToAtWorld(t,e)}zoomByAtWorld(t,e){this._zoomBatcher.queueZoomByAtWorld(t,e)}_actualPanByWorld(e){const i=this._panBy(e,this._camera,this._config);this._camera.setPosition(t.addVector(this._camera.position,i))}_actualPanToWorld(t){const e=this._panTo(t,this._camera,this._config);this._camera.setPosition(e)}panByWorld(t){this._positionBatcher.queuePositionUpdateBy(t)}panByViewPort(e){const i=t.multiplyVectorByScalar(t.rotatePoint(e,this._camera.rotation),1/this._camera.zoomLevel);this._positionBatcher.queuePositionUpdateBy(i)}panToWorld(t){this._positionBatcher.queuePositionUpdateTo(t)}panToViewPort(t){const e=this._camera.convertFromViewPort2WorldSpace(t);this._positionBatcher.queuePositionUpdateTo(e)}rotateBy(t){this._rotationBatcher.queueRotationUpdateBy(t)}rotateTo(t){this._rotationBatcher.queueRotationUpdateTo(t)}set limitEntireViewPort(t){this._config.limitEntireViewPort=t}get limitEntireViewPort(){return this._config.limitEntireViewPort}get camera(){return this._camera}get config(){return this._config}set config(t){this._config=Object.assign({},t)}updatePosition(){const t=this._positionBatcher.processQueuedUpdates();if(null!=t)switch(t.type){case"destination":this._actualPanToWorld(t);break;case"delta":this._actualPanByWorld(t);break;default:throw new Error("Invalid position update type")}}updateZoom(){const t=this._zoomBatcher.processQueuedUpdates();if(null!=t)if("world"===t.anchorCoordinateSystem)switch(t.update.type){case"destination":if(t.update.anchor)this._zoomToAtWorld(t.update.destination,t.update.anchor);else{const e=this._zoomTo(t.update.destination,this._camera,this._config);this._camera.setZoomLevel(e)}break;case"delta":if(t.update.anchor)this._zoomByAtWorld(t.update.delta,t.update.anchor);else{const e=this._zoomBy(t.update.delta,this._camera,this._config);this._camera.setZoomLevel(this._camera.zoomLevel+e)}}else switch(t.update.type){case"destination":if(t.update.anchor)this._zoomToAtViewPort(t.update.destination,t.update.anchor);else{const e=this._zoomTo(t.update.destination,this._camera,this._config);this._camera.setZoomLevel(e)}break;case"delta":if(t.update.anchor)this._zoomByAtViewPort(t.update.delta,t.update.anchor);else{const e=this._zoomBy(t.update.delta,this._camera,this._config);this._camera.setZoomLevel(this._camera.zoomLevel+e)}}}updateRotation(){const t=this._rotationBatcher.processQueuedUpdates();if(null!=t)switch(t.type){case"destination":const e=this._rotateTo(t.destination,this._camera,this._config);this._camera.setRotation(e);break;case"delta":const i=this._rotateBy(t.delta,this._camera,this._config);this._camera.setRotation(this._camera.rotation+i);break;default:throw new Error("Invalid rotation update type")}}update(){this.updateZoom(),this.updatePosition(),this.updateRotation()}_zoomToAtViewPort(e,i){const o=this._camera.convertFromViewPort2WorldSpace(i),n=this._zoomTo(e,this._camera,this._config);this._camera.setZoomLevel(n);const a=this._camera.convertFromViewPort2WorldSpace(i),s=t.subVector(o,a),r=this._panBy(s,this._camera,this._config);this._camera.setPosition(t.addVector(this._camera.position,r))}_zoomToAtWorld(e,i){let o=this._camera.convertFromWorld2ViewPort(i);const n=this._zoomTo(e,this._camera,this._config);this._camera.setZoomLevel(n);let a=this._camera.convertFromWorld2ViewPort(i);const s=t.subVector(o,a),r=this._panBy(s,this._camera,this._config);this._camera.setPosition(t.addVector(this._camera.position,r))}_zoomByAtViewPort(e,i){const o=this._camera.convertFromViewPort2WorldSpace(i),n=this._zoomBy(e,this._camera,this._config);this._camera.setZoomLevel(this._camera.zoomLevel+n);const a=this._camera.convertFromViewPort2WorldSpace(i),s=t.subVector(o,a),r=this._panBy(s,this._camera,this._config);this._camera.setPosition(t.addVector(this._camera.position,r))}_zoomByAtWorld(e,i){let o=this._camera.convertFromWorld2ViewPort(i);const n=this._zoomBy(e,this._camera,this._config);this._camera.setZoomLevel(this._camera.zoomLevel+n);let a=this._camera.convertFromWorld2ViewPort(i);const s=y(t.subVector(o,a),this._camera.zoomLevel,this._camera.rotation),r=this._panBy(s,this._camera,this._config);this._camera.setPosition(t.addVector(this._camera.position,r))}configure(t){this._config=Object.assign(Object.assign({},this._config),t)}cleanup(){}setup(){}}function vt(t){return new ft({limitEntireViewPort:!0,restrictRelativeXTranslation:!1,restrictRelativeYTranslation:!1,restrictXTranslation:!1,restrictYTranslation:!1,restrictZoom:!1,clampTranslation:!0,clampZoom:!0},t)}class gt{constructor(t,e=new j){this._panBy=X(),this._panTo=G(),this._zoomTo=st(),this._zoomBy=rt(),this._rotateBy=dt(),this._rotateTo=mt(),this._config=Object.assign(Object.assign({},t),{restrictRotation:!1,clampRotation:!0}),this._camera=e}zoomToAt(e,i){let o=this._camera.convertFromViewPort2WorldSpace(i);const n=this._zoomTo(e,this._camera,this._config);this._camera.setZoomLevel(n);let a=this._camera.convertFromViewPort2WorldSpace(i);const s=t.subVector(o,a),r=this._panBy(s,this._camera,this._config);this._camera.setPosition(t.addVector(this._camera.position,r))}zoomByAt(e,i){let o=this._camera.convertFromViewPort2WorldSpace(i);const n=this._zoomBy(e,this._camera,this._config);this._camera.setZoomLevel(this._camera.zoomLevel+n);let a=this._camera.convertFromViewPort2WorldSpace(i);const s=t.subVector(o,a),r=this._panBy(s,this._camera,this._config);this._camera.setPosition(t.addVector(this._camera.position,r))}zoomTo(t){this._zoomTo(t,this._camera,this._config)}zoomBy(t){this._zoomBy(t,this._camera,this._config)}zoomToAtWorld(e,i){let o=this._camera.convertFromWorld2ViewPort(i);const n=this._zoomTo(e,this._camera,this._config);this._camera.setZoomLevel(n);let a=this._camera.convertFromWorld2ViewPort(i);const s=y(t.subVector(a,o),this._camera.zoomLevel,this._camera.rotation),r=this._panBy(s,this._camera,this._config);this._camera.setPosition(t.addVector(this._camera.position,r))}zoomByAtWorld(e,i){let o=this._camera.convertFromWorld2ViewPort(i);const n=this._zoomBy(e,this._camera,this._config);this._camera.setZoomLevel(this._camera.zoomLevel+n);let a=this._camera.convertFromWorld2ViewPort(i);const s=y(t.subVector(a,o),this._camera.zoomLevel,this._camera.rotation),r=this._panBy(s,this._camera,this._config);this._camera.setPosition(t.addVector(this._camera.position,r))}panByViewPort(e){const i=t.multiplyVectorByScalar(t.rotatePoint(e,this._camera.rotation),1/this._camera.zoomLevel),o=this._panBy(i,this._camera,this._config);this._camera.setPosition(t.addVector(this._camera.position,o))}panByWorld(t){const e=this._camera.convertFromWorld2ViewPort(t);this.panByViewPort(e)}panToWorld(t){const e=this._panTo(t,this._camera,this._config);this._camera.setPosition(e)}panToViewPort(t){const e=this._camera.convertFromViewPort2WorldSpace(t);this.panToWorld(e)}rotateBy(t){const e=this._rotateBy(t,this._camera,this._config);this._camera.setRotation(this._camera.rotation+e)}rotateTo(t){const e=this._rotateTo(t,this._camera,this._config);this._camera.setRotation(e)}set limitEntireViewPort(t){this._config.limitEntireViewPort=t}get limitEntireViewPort(){return this._config.limitEntireViewPort}get camera(){return this._camera}get config(){return this._config}set config(t){this._config=Object.assign({},t)}configure(t){this._config=Object.assign(Object.assign({},this._config),t)}cleanup(){}setup(){}update(){}}function Pt(t){return new gt({limitEntireViewPort:!0,restrictRelativeXTranslation:!1,restrictRelativeYTranslation:!1,restrictXTranslation:!1,restrictYTranslation:!1,restrictZoom:!1,clampTranslation:!0,clampZoom:!0},t)}class xt{constructor(t,e){this._canvas=t,this.bindFunctions(),this._abortController=new AbortController,this._stateMachine=e,this._keyfirstPressed=new Map}get disabled(){return this._disabled}set disabled(t){this._disabled=t}get stateMachine(){return this._stateMachine}addEventListeners(t){this._canvas.addEventListener("pointerdown",this.pointerDownHandler,{signal:t}),this._canvas.addEventListener("pointerup",this.pointerUpHandler,{signal:t}),this._canvas.addEventListener("pointermove",this.pointerMoveHandler,{signal:t}),this._canvas.addEventListener("wheel",this.scrollHandler,{signal:t}),window.addEventListener("keydown",this.keypressHandler,{signal:t}),window.addEventListener("keyup",this.keyupHandler,{signal:t})}setUp(){this.addEventListeners(this._abortController.signal)}tearDown(){this._abortController.abort(),this._abortController=new AbortController}bindFunctions(){this.pointerDownHandler=this.pointerDownHandler.bind(this),this.pointerUpHandler=this.pointerUpHandler.bind(this),this.pointerMoveHandler=this.pointerMoveHandler.bind(this),this.scrollHandler=this.scrollHandler.bind(this),this.keypressHandler=this.keypressHandler.bind(this),this.keyupHandler=this.keyupHandler.bind(this)}pointerDownHandler(t){this._disabled||(0!==t.button||"mouse"!==t.pointerType?1!==t.button||"mouse"!==t.pointerType||this.stateMachine.happens("middlePointerDown",{x:t.clientX,y:t.clientY}):this.stateMachine.happens("leftPointerDown",{x:t.clientX,y:t.clientY}))}pointerUpHandler(t){this._disabled||(0!==t.button||"mouse"!==t.pointerType?1!==t.button||"mouse"!==t.pointerType||this.stateMachine.happens("middlePointerUp",{x:t.clientX,y:t.clientY}):this.stateMachine.happens("leftPointerUp",{x:t.clientX,y:t.clientY}))}pointerMoveHandler(t){this._disabled||(1!==t.buttons||"mouse"!==t.pointerType?4!==t.buttons||"mouse"!==t.pointerType||this.stateMachine.happens("middlePointerMove",{x:t.clientX,y:t.clientY}):this.stateMachine.happens("leftPointerMove",{x:t.clientX,y:t.clientY}))}scrollHandler(t){this._disabled||(t.preventDefault(),t.ctrlKey?this.stateMachine.happens("scrollWithCtrl",{x:t.clientX,y:t.clientY,deltaX:t.deltaX,deltaY:t.deltaY}):this.stateMachine.happens("scroll",{deltaX:t.deltaX,deltaY:t.deltaY}))}keypressHandler(t){this._keyfirstPressed.has(t.key)||(this._keyfirstPressed.set(t.key,!0)," "===t.key&&(t.preventDefault(),this.stateMachine.happens("spacebarDown",{})))}keyupHandler(t){this._keyfirstPressed.has(t.key)&&this._keyfirstPressed.delete(t.key)," "===t.key&&this.stateMachine.happens("spacebarUp",{})}attach(t){this.tearDown(),this._canvas=t,this.setUp()}}class bt{constructor(t,e){this._panDisabled=!1,this._zoomDisabled=!1,this._rotateDisabled=!1,this._canvas=t,this._disabled=!1,this.touchSM=e,this._abortController=new AbortController,this.bindListeners()}get touchStateMachine(){return this.touchSM}bindListeners(){this.touchstartHandler=this.touchstartHandler.bind(this),this.touchendHandler=this.touchendHandler.bind(this),this.touchcancelHandler=this.touchcancelHandler.bind(this),this.touchmoveHandler=this.touchmoveHandler.bind(this)}enableStrategy(){this._disabled=!1}disableStrategy(){this._disabled=!0}setUp(){this._canvas.addEventListener("touchstart",this.touchstartHandler,{signal:this._abortController.signal}),this._canvas.addEventListener("touchend",this.touchendHandler,{signal:this._abortController.signal}),this._canvas.addEventListener("touchcancel",this.touchcancelHandler,{signal:this._abortController.signal}),this._canvas.addEventListener("touchmove",this.touchmoveHandler,{signal:this._abortController.signal})}tearDown(){this._abortController.abort(),this._abortController=new AbortController}get disabled(){return this._disabled}get alignCoordinateSystem(){return this._touchInputTracker.alignCoordinateSystem}set alignCoordinateSystem(t){this._touchInputTracker.alignCoordinateSystem=t}get panDisabled(){return this._panDisabled}set panDisabled(t){this._panDisabled=t}get zoomDisabled(){return this._zoomDisabled}set zoomDisabled(t){this._zoomDisabled=t}get rotateDisabled(){return this._rotateDisabled}set rotateDisabled(t){this._rotateDisabled=t}touchstartHandler(t){if(this._disabled)return;const e=[];for(let i=0;i<t.changedTouches.length;i++)e.push({ident:t.changedTouches[i].identifier,x:t.changedTouches[i].clientX,y:t.changedTouches[i].clientY});this.touchSM.happens("touchstart",{points:e}),t.preventDefault()}touchcancelHandler(t){if(this._disabled)return;const e=[];for(let i=0;i<t.changedTouches.length;i++)e.push({ident:t.changedTouches[i].identifier,x:t.changedTouches[i].clientX,y:t.changedTouches[i].clientY});this.touchSM.happens("touchend",{points:e})}touchendHandler(t){if(this._disabled)return;const e=[];for(let i=0;i<t.changedTouches.length;i++)e.push({ident:t.changedTouches[i].identifier,x:t.changedTouches[i].clientX,y:t.changedTouches[i].clientY});this.touchSM.happens("touchend",{points:e})}touchmoveHandler(t){if(this._disabled)return;t.preventDefault();const e=[];for(let i=0;i<t.targetTouches.length;i++)e.push({ident:t.targetTouches[i].identifier,x:t.targetTouches[i].clientX,y:t.targetTouches[i].clientY});this.touchSM.happens("touchmove",{points:e})}attach(t){this.tearDown(),this._canvas=t,this.setUp()}}function Tt(t,e,i,o){const n=C(t),a=I(t);if(null==n||null==a)return;let s=e/Math.abs(n*Math.cos(o)),r=e/Math.abs(a*Math.cos(o)),h=i/Math.abs(n*Math.sin(o)),c=i/Math.abs(a*Math.sin(o));s==1/0&&(s=0),r==1/0&&(r=0),h==1/0&&(h=0),c==1/0&&(c=0);const l=i/a,u=e/n;return Math.max(l,u,s,r,h,c)}function wt(t,e){return null!=e&&(null==t||e!=1/0&&(void 0!==t&&(null==t.min||e>t.min)))}function Ct(t,e,i,o){const n=C(t);if(null==n)return;const a=Math.abs(n*Math.cos(o)),s=Math.abs(n*Math.sin(o));if(e/a==1/0)return i/s;return Math.max(e/a,i/s)}function Bt(t,e,i,o){const n=I(t);if(null==n)return;const a=e/Math.abs(n*Math.cos(o)),s=i/Math.abs(n*Math.sin(o));if(s==1/0)return a;return Math.max(a,s)}function It(t){if(t<=0)return 0;let e=0;if(t<1){let i=1;for(;i>t;)i/=10,e--}else{let i=1;for(;10*i<=t;)i*=10,e++}return e}function Rt(e,i,o,n,a=1,s=.3){const r=t.distanceBetweenPoints(o,n),h=10<r*i*.5?10/i:.5*r,c=r-h,l=t.linearInterpolation(o,n,c/r);e.beginPath(),e.lineWidth=a/i,e.moveTo(o.x,o.y),e.lineTo(l.x,l.y),e.stroke();const u=t.rotatePoint(t.unitVectorFromA2B(n,o),Math.PI/2),d=t.addVector(l,t.multiplyVectorByScalar(u,.5*h)),m=t.subVector(l,t.multiplyVectorByScalar(u,.5*h));e.beginPath(),e.moveTo(n.x,n.y),e.lineTo(d.x,d.y),e.lineTo(m.x,m.y),e.closePath(),e.fill()}const St=30,Mt=9,Ot=15,At=10,zt=2.5,Vt=20,Et=10;function kt(t,e,i,o,n,a){const{minMajorTickValue:s,maxMajorTickValue:r,majorTickStep:h,minMinTickValue:c,maxMaxTickValue:l,minTickStep:u,minHalfTickValue:d,maxHalfTickValue:m,halfTickStep:_,calibrationMultiplier:p,normalizedOrderOfMagnitude:y}=Zt(e.x,i.x);t.save(),t.strokeStyle="red";for(let i=s;i<=r;i+=h){Lt(t,a,{x:i*p,y:e.y},n?30/a:-30/a,i*p,{textOffset:n?10/a:-10/a,fontSize:20})}for(let i=c;i<=l;i+=u){if(i%h==0)continue;if(i%_==0)continue;Lt(t,a,{x:i*p,y:e.y},n?9/a:-9/a,i)}for(let i=d;i<=m;i+=_){if(i%h==0)continue;Lt(t,a,{x:i*p,y:e.y},n?15/a:-15/a,i*p,{textOffset:n?2.5/a:-2.5/a,fontSize:10,color:"red"})}t.restore();const{minMajorTickValue:f,maxMajorTickValue:v,majorTickStep:g,minMinTickValue:P,maxMaxTickValue:x,minTickStep:b,minHalfTickValue:T,maxHalfTickValue:w,halfTickStep:C,calibrationMultiplier:B}=Zt(e.y,o.y,y);t.save(),t.strokeStyle="green";for(let i=f;i<=v;i+=g){Ht(t,a,{x:e.x,y:i*B},30/a,i,{textOffset:10/a,fontSize:20})}for(let i=T;i<=w;i+=C){if(i%g==0)continue;Ht(t,a,{x:e.x,y:i*B},15/a,i,{textOffset:2.5/a,fontSize:10})}for(let i=P;i<=x;i+=b){if(i%g==0)continue;Ht(t,a,{x:e.x,y:i*B},9/a,i)}t.restore()}function Ht(t,e,i,o,n,a){var s;const r=void 0!==a;if(t.save(),t.lineWidth=1/e,t.beginPath(),t.moveTo(i.x,i.y),t.lineTo(i.x+o,i.y),t.stroke(),t.restore(),!r)return;const h=null!==(s=a.color)&&void 0!==s?s:"green";t.save(),t.textAlign="left",t.textBaseline="middle",t.fillStyle=h,t.font=a.fontSize/e+"px Arial";const c=n%1==0?n:n.toFixed(2);t.fillText(`${c}`,i.x+o+a.textOffset,i.y),t.restore()}function Lt(t,e,i,o,n,a){var s;const r=void 0!==a;if(t.save(),t.lineWidth=1/e,t.beginPath(),t.moveTo(i.x,i.y),t.lineTo(i.x,i.y+o),t.stroke(),t.restore(),!r)return;const h=null!==(s=a.color)&&void 0!==s?s:"red";t.save(),t.textAlign="center",t.textBaseline="top",t.fillStyle=h,t.font=a.fontSize/e+"px Arial";const c=n%1==0?n:n.toFixed(2);t.fillText(`${c}`,i.x,i.y+o+a.textOffset),t.restore()}function Zt(t,e,i){const o=Math.min(t,e),n=Math.max(t,e),a=i||It(n-o),s=Math.max(1,a),r=Math.pow(10,s-a),h=(t>0?Math.floor(o*r/Math.pow(10,s)):Math.ceil(o*r/Math.pow(10,s)))*Math.pow(10,s),c=(e>0?Math.floor(n*r/Math.pow(10,s)):Math.ceil(n*r/Math.pow(10,s)))*Math.pow(10,s),l=Math.pow(10,s),u=s-1,d=l/2;return{minMajorTickValue:h,maxMajorTickValue:c,majorTickStep:l,minMinTickValue:(t>0?Math.floor(o*r/Math.pow(10,u)):Math.ceil(o*r/Math.pow(10,u)))*Math.pow(10,u),maxMaxTickValue:(e>0?Math.floor(n*r/Math.pow(10,u)):Math.ceil(n*r/Math.pow(10,u)))*Math.pow(10,u),minTickStep:Math.pow(10,u),minHalfTickValue:(t>0?Math.floor(o*r/d):Math.ceil(o*r/d))*d,maxHalfTickValue:(e>0?Math.floor(n*r/d):Math.ceil(n*r/d))*d,halfTickStep:d,calibrationMultiplier:1/r,normalizedOrderOfMagnitude:s}}function Ut(t,e,i,o,n,a="red"){let s=n/2;s/=i,t.beginPath(),t.strokeStyle=a,t.lineWidth=2/i,o?(t.moveTo(e.x-s,e.y),t.lineTo(e.x+s,e.y),t.moveTo(e.x,e.y-s),t.lineTo(e.x,e.y+s)):(t.moveTo(e.x-s,-e.y),t.lineTo(e.x+s,-e.y),t.moveTo(e.x,-e.y-s),t.lineTo(e.x,-e.y+s)),t.stroke(),t.lineWidth=3}function Nt(t,e,i){if(!T(e))return;const o=C(e),n=I(e),a=null==e?void 0:e.min,s=null==a?void 0:a.x,r=null==a?void 0:a.y;null!=s&&null!=r&&null!=o&&null!=n&&(t.beginPath(),t.strokeStyle="blue",t.lineWidth=100,i?t.roundRect(s,r,o,n,5):t.roundRect(s,-r,o,-n,5),t.stroke(),t.lineWidth=3,t.strokeStyle="black")}function Wt(t,e,i,o){if(!T(e))return;const n=C(e),a=I(e),s=null==e?void 0:e.min,r=null==s?void 0:s.x,h=null==s?void 0:s.y;null!=r&&null!=h&&null!=n&&null!=a&&(t.lineWidth=1/i,t.beginPath(),t.strokeStyle="rgba(87, 173, 72, 0.8)",t.moveTo(0,0),o?t.lineTo(0,h+a):t.lineTo(0,-h-a),t.stroke(),t.beginPath(),t.strokeStyle="rgba(220, 59, 59, 0.8)",t.moveTo(0,0),t.lineTo(r+n,0),t.stroke(),t.strokeStyle="black")}function Dt(e,i,o,n,a,s,r){let h=t.unitVectorFromA2B(i,o),c=t.unitVectorFromA2B(n,i),l=t.distanceBetweenPoints(i,o);t.distanceBetweenPoints(i,n);let u=It(l),d=Math.pow(10,u)/10,m=Math.ceil(i.x/d)*d,_=Math.floor(o.x/d)*d,p=s?Math.floor(i.y/d)*d:Math.ceil(n.y/d)*d,y=s?Math.ceil(n.y/d)*d:Math.floor(i.y/d)*d;for(let o=m;o<=_;o+=d){const a=t.addVector({x:o,y:i.y},t.multiplyVectorByScalar(h,d)),s=t.addVector({x:o,y:n.y},t.multiplyVectorByScalar(h,d));e.beginPath(),e.strokeStyle="black",e.fillStyle="black",e.lineWidth=.5/r,e.moveTo(a.x,a.y),e.lineTo(s.x,s.y),e.stroke()}for(let n=p;n<=y;n+=d){const a=t.addVector({x:i.x,y:n},t.multiplyVectorByScalar(c,d)),s=t.addVector({x:o.x,y:n},t.multiplyVectorByScalar(c,d));e.beginPath(),e.strokeStyle="black",e.fillStyle="black",e.lineWidth=.5/r,e.moveTo(a.x,a.y),e.lineTo(s.x,s.y),e.stroke()}}function Ft(e,i,o,n,a,s,r){let h=t.unitVectorFromA2B(i,o),c=t.unitVectorFromA2B(n,i),l=It(t.distanceBetweenPoints(i,o)),u=Math.pow(10,l),d=u/2,m=u/10,_=1;l<=0&&(_=Math.pow(10,1-l));let p=Math.ceil(i.x/u)*u,y=Math.floor(o.x/u)*u,f=s?Math.ceil(i.y/u)*u:Math.floor(n.y/u)*u;s?Math.floor(n.y/u):Math.ceil(i.y/u);let v=Math.ceil(i.x/d)*d,g=Math.floor(o.x/d)*d,P=s?Math.ceil(i.y/d)*d:Math.floor(n.y/d)*d,x=s?Math.floor(n.y/d)*d:Math.ceil(i.y/d)*d,b=Math.ceil(i.x/m)*m,T=Math.floor(o.x/m)*m,w=s?Math.ceil(i.y/m)*m:Math.floor(n.y/m)*m,C=s?Math.floor(n.y/m)*m:Math.ceil(i.y/m)*m,B=d*r,I=m*r;e.font=`bold ${20/r}px Helvetica`;const R=e.measureText(""+-(d+v)),S=R.fontBoundingBoxAscent+R.fontBoundingBoxDescent,M=e.measureText(""+-(m+b)),O=M.fontBoundingBoxAscent+M.fontBoundingBoxDescent,A=Math.ceil((y-p)/u);for(let o=0;o<=A;o++){const n=p+o*u;e.beginPath(),e.strokeStyle="black",e.fillStyle="black",e.lineWidth=5/r;let a=t.addVector({x:n,y:i.y},t.multiplyVectorByScalar(c,50/r));s?e.moveTo(a.x,a.y):e.moveTo(a.x,-a.y),a=t.addVector({x:n,y:i.y},t.multiplyVectorByScalar(c,-50/r)),s?e.lineTo(a.x,a.y):e.lineTo(a.x,-a.y),e.textAlign="center",e.textBaseline="middle",e.font=`bold ${20/r}px Helvetica`;const h=e.measureText(`${Math.abs(n)%1==0?n.toFixed(0):n.toFixed(2)}`),l=h.fontBoundingBoxAscent+h.fontBoundingBoxDescent;s?(a=t.addVector(a,{x:0,y:l/2+.2*l}),e.fillText(`${Math.abs(n)%1==0?n.toFixed(0):n.toFixed(2)}`,a.x,a.y)):(a=t.addVector(a,{x:0,y:-l/2-.2*l}),e.fillText(`${Math.abs(n)%1==0?n.toFixed(0):n.toFixed(2)}`,a.x,-a.y)),e.stroke()}const z=Math.ceil((y-p)/u);for(let o=0;o<=z;o++){const n=f+o*u;e.beginPath(),e.strokeStyle="black",e.fillStyle="black",e.lineWidth=5/r;let a=t.addVector({x:i.x,y:n},t.multiplyVectorByScalar(h,-50/r));s?e.moveTo(a.x,a.y):e.moveTo(a.x,-a.y),a=t.addVector({x:i.x,y:n},t.multiplyVectorByScalar(h,50/r)),s?e.lineTo(a.x,a.y):e.lineTo(a.x,-a.y),e.textAlign="center",e.textBaseline="middle",e.font=`bold ${20/r}px Helvetica`;const c=e.measureText(`${Math.abs(n)%1==0?n.toFixed(0):n.toFixed(2)}`);a=t.addVector(a,{x:c.width/2+.3*c.width,y:0}),s?e.fillText(`${Math.abs(n)%1==0?n.toFixed(0):n.toFixed(2)}`,a.x,a.y):e.fillText(`${Math.abs(n)%1==0?n.toFixed(0):n.toFixed(2)}`,a.x,-a.y),e.stroke()}const V=Math.ceil((g-v)/d);for(let o=0;o<=V;o++){const n=v+o*d;if(Math.floor(n*_)%Math.floor(u*_)==0)continue;e.beginPath(),e.strokeStyle="black",e.fillStyle="black",e.lineWidth=3/r;let a=t.addVector({x:n,y:i.y},t.multiplyVectorByScalar(c,25/r));s?e.moveTo(a.x,a.y):e.moveTo(a.x,-a.y),a=t.addVector({x:n,y:i.y},t.multiplyVectorByScalar(c,-25/r)),s?e.lineTo(a.x,a.y):e.lineTo(a.x,-a.y),e.font=15/r+"px Helvetica";const h=e.measureText(`${Math.abs(n)%1==0?n.toFixed(0):n.toFixed(2)}`);if(B>2*R.width){e.textAlign="center",e.textBaseline="middle";const i=h.fontBoundingBoxAscent+h.fontBoundingBoxDescent;s?a=t.addVector(a,{x:0,y:i/2+.2*i}):(a=t.addVector(a,{x:0,y:-i/2-.2*i}),a=t.flipYAxis(a)),e.fillText(`${Math.abs(n)%1==0?n.toFixed(0):n.toFixed(2)}`,a.x,a.y)}e.stroke()}const E=Math.ceil((x-P)/d);for(let o=0;o<=E;o++){const n=P+o*d;if(Math.floor(n*_)%Math.floor(u*_)==0)continue;e.beginPath(),e.strokeStyle="black",e.fillStyle="black",e.lineWidth=3/r;let a=t.addVector({x:i.x,y:n},t.multiplyVectorByScalar(h,-25/r));s?e.moveTo(a.x,a.y):e.moveTo(a.x,-a.y),a=t.addVector({x:i.x,y:n},t.multiplyVectorByScalar(h,25/r)),s?e.lineTo(a.x,a.y):e.lineTo(a.x,-a.y),e.font=18/r+"px Helvetica";const c=e.measureText(`${Math.abs(n)%1==0?n.toFixed(0):n.toFixed(2)}`);c.fontBoundingBoxAscent,c.fontBoundingBoxDescent,B>2*S&&(e.textAlign="center",e.textBaseline="middle",a=t.addVector(a,{x:c.width/2+.3*c.width,y:0}),s||(a=t.flipYAxis(a)),e.fillText(`${Math.abs(n)%1==0?n.toFixed(0):n.toFixed(2)}`,a.x,a.y)),e.stroke()}const k=Math.ceil((T-b)/m);for(let o=0;o<=k;o++){const n=b+o*m;if(Math.floor(n*_)%Math.floor(u*_)==0||Math.floor(n*_)%Math.floor(d*_)==0)continue;e.beginPath(),e.strokeStyle="black",e.fillStyle="black",e.lineWidth=1/r;let a=t.addVector({x:n,y:i.y},t.multiplyVectorByScalar(c,12.5/r));s?e.moveTo(a.x,a.y):e.moveTo(a.x,-a.y),a=t.addVector({x:n,y:i.y},t.multiplyVectorByScalar(c,-12.5/r)),s?e.lineTo(a.x,a.y):e.lineTo(a.x,-a.y),e.font=10/r+"px Helvetica";const h=e.measureText(`${Math.abs(n)%1==0?n.toFixed(0):n.toFixed(2)}`);if(I>2*M.width){e.textAlign="center",e.textBaseline="middle";const i=h.fontBoundingBoxAscent+h.fontBoundingBoxDescent;s?a=t.addVector(a,{x:0,y:i/2+.2*i}):(a=t.addVector(a,{x:0,y:-i/2-.2*i}),a=t.flipYAxis(a)),e.fillText(`${Math.abs(n)%1==0?n.toFixed(0):n.toFixed(2)}`,a.x,a.y)}e.stroke()}const H=Math.ceil((C-w)/m);for(let o=0;o<=H;o++){const n=w+o*m;if(Math.floor(n*_)%Math.floor(u*_)==0||Math.floor(n*_)%Math.floor(d*_)==0)continue;e.beginPath(),e.strokeStyle="black",e.fillStyle="black",e.lineWidth=1/r;let a=t.addVector({x:i.x,y:n},t.multiplyVectorByScalar(h,-12.5/r));s?e.moveTo(a.x,a.y):e.moveTo(a.x,-a.y),a=t.addVector({x:i.x,y:n},t.multiplyVectorByScalar(h,12.5/r)),s?e.lineTo(a.x,a.y):e.lineTo(a.x,-a.y),e.font=12/r+"px Helvetica";const c=e.measureText(`${Math.abs(n)%1==0?n.toFixed(0):n.toFixed(2)}`);c.fontBoundingBoxAscent,c.fontBoundingBoxDescent,I>2*O&&(e.textAlign="center",e.textBaseline="middle",a=t.addVector(a,{x:c.width/2+.3*c.width,y:0}),s||(a=t.flipYAxis(a)),e.fillText(`${Math.abs(n)%1==0?n.toFixed(0):n.toFixed(2)}`,a.x,a.y)),e.stroke()}}function jt(t,e,i,o,n=20,a="red"){n/=i,t.font=20/i+"px Arial",t.fillStyle=a,o?t.fillText(`x: ${e.x.toFixed(2)}, y: ${e.y.toFixed(2)}`,e.x+n,e.y+n):t.fillText(`x: ${e.x.toFixed(2)}, y: ${e.y.toFixed(2)}`,e.x+n,-e.y-n),t.fillStyle="black"}function qt(t,e,i){t.beginPath(),t.strokeStyle="rgba(87, 173, 72, 0.8)",i?t.arc(e.x,e.y,5,0,2*Math.PI):t.arc(e.x,-e.y,5,0,2*Math.PI),t.stroke(),t.strokeStyle="black"}class Yt{constructor(t){this._observers=new H,this.lastRect=t.getBoundingClientRect(),this.resizeObserver=new ResizeObserver((t=>{for(const e of t){const t=Gt(e.target.getBoundingClientRect(),window.getComputedStyle(e.target));Xt(this.lastRect,t)&&(this.publishPositionUpdate(t),this.lastRect=t)}})),this.intersectionObserver=new IntersectionObserver((t=>{for(const e of t)if(e.isIntersecting){const t=Gt(e.boundingClientRect,window.getComputedStyle(e.target));Xt(this.lastRect,t)&&(this.publishPositionUpdate(t),this.la