qm-map-maplibre-gl 0.1.2 → 0.1.3

package/dist/qm-map.es.js

@@ -414,13 +414,7 @@ var w = t(C), T = t((e) => {
 			checkable: !0,
 			checkedKeys: c,
 			onCheck: (e) => g(e),
-			treeData: f,
-			style: {
-				fontSize: 12,
-				maxHeight: 400,
-				overflowX: "hidden",
-				overflowY: "auto"
-			}
+			treeData: f
 		})
 	});
 }), re = t((e) => {

package/dist/qm-map.umd.js

@@ -1,4 +1,4 @@
-(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require("react"),require("maplibre-gl"),require("react/jsx-runtime"),require("react-dom"),require("@mapbox/mapbox-gl-draw")):typeof define==`function`&&define.amd?define([`exports`,`react`,`maplibre-gl`,`react/jsx-runtime`,`react-dom`,`@mapbox/mapbox-gl-draw`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.QmMap={},e.react,e.maplibre_gl,e.react_jsx_runtime,e[`react-dom`],e._mapbox_mapbox_gl_draw))})(this,function(e,t,n,r,i,a){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var o=Object.create,s=Object.defineProperty,c=Object.getOwnPropertyDescriptor,l=Object.getOwnPropertyNames,u=Object.getPrototypeOf,d=Object.prototype.hasOwnProperty,f=(e,t,n,r)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var i=l(t),a=0,o=i.length,u;a<o;a++)u=i[a],!d.call(e,u)&&u!==n&&s(e,u,{get:(e=>t[e]).bind(null,u),enumerable:!(r=c(t,u))||r.enumerable});return e},p=(e,t,n)=>(n=e==null?{}:o(u(e)),f(t||!e||!e.__esModule?s(n,`default`,{value:e,enumerable:!0}):n,e));t=p(t,1),a=p(a,1);function m(e,t=new WeakMap){if(typeof e!=`object`||!e)return e;if(t.has(e))return t.get(e);let n;return e instanceof Date?n=new Date(e.getTime()):e instanceof RegExp?(n=new RegExp(e.source,e.flags),n.lastIndex=e.lastIndex):e instanceof Map?(n=new Map,t.set(e,n),e.forEach((e,r)=>{n.set(m(r,t),m(e,t))})):e instanceof Set?(n=new Set,t.set(e,n),e.forEach(e=>{n.add(m(e,t))})):Array.isArray(e)?(n=[],t.set(e,n),e.forEach((e,r)=>{n[r]=m(e,t)})):(n=Object.create(Object.getPrototypeOf(e)),t.set(e,n),Reflect.ownKeys(e).forEach(r=>{let i=e[r];n[r]=m(i,t)})),n}var h=(e,t)=>{let n=null;return r=>{n&&clearTimeout(n),n=setTimeout(()=>{e(r)},t)}},g=(e,t)=>{Array.isArray(t)&&t.length>0&&t.forEach(t=>{e.push(t),t.layers instanceof Array&&g(e,t.layers)})},_=class{_options;get options(){return this._options}constructor(e){this._options=e}onAdd(e,t){if(this._options.isAdd===!1){this._options.isAdd=!1;return}t=e.findValidBeforeId(this._options.id),this.add(e,t),this._options.isAdd=!0}onRemove(e,t){if(this._options.isAdd)return;e.getLayer(this._options.id)&&e.removeLayer(this._options.id);let n=this._options.id+`-ds`;t&&e.removeSource(n),this._options.isAdd=!1}},v=class extends _{constructor(e){super(e),this._options=e}add(e,t){let{id:n,source:r}=this._options,i=this._options.id+`-ds`;typeof r==`string`&&(i=r),!e.getSource(i)&&r&&typeof r!=`string`&&e.addSource(i,r);let a=e.getLayer(n),o=e.getSource(i);if(!a&&o){let n={...this._options,source:i};e.addLayer(n,t)}}},y=class e{_options;get options(){return this._options}_layers=[];get layers(){return this._layers}constructor(t){this._options=t,t.layers.forEach(t=>{let n;n=`layers`in t?new e(t):new v(t),this._layers.push(n)})}onAdd(e,t){this._layers.forEach(n=>{e.addLayerWrapper(n,t)}),this.updateOptions()}onRemove(e){this._layers.forEach(t=>{e.removeLayerWrapper(t,!1)}),this.updateOptions()}updateOptions(){let e=this._layers.findIndex(e=>e.options.isAdd)>-1;this._options.isAdd=e}},b={MAPINITED:`MAPINITED`,MAPCLICKED:`MAPCLICKED`,MAPLAYERCHANGED:`MAPLAYERCHANGED`,MAPDESTRORY:`MAPDESTRORY`},x=class extends n.Map{_id;get id(){return this._id}_options;get options(){return this._options}_mapLayerSetting;get mapLayerSetting(){return this._mapLayerSetting}_images=[];get images(){return this._images}_layers=[];get layers(){return this._layers}constructor(e){super(e),this._options=e,this._id=e.id,this._mapLayerSetting=[],this.fire(b.MAPINITED,{map:this})}getLayerWrapper(e,t){for(let n of e)if(n.options.id===t)return n;else if(`layers`in n){let e=this.getLayerWrapper(n.layers,t);if(e)return e}}addLayerWrapper(e,t){e.onAdd(this,t),this.fire(b.MAPLAYERCHANGED,{map:this,layer:e})}removeLayerWrapper(e,t){e.onRemove(this,t),this.fire(b.MAPLAYERCHANGED,{map:this,layer:e})}load(e){this._mapLayerSetting=e,e.forEach(e=>{let t;t=`layers`in e?new y(e):new v(e),this.addLayerWrapper(t),this._layers.push(t)})}selectFeature(e){this.clearSelect();let t=`selected-ds`;this.addSource(t,{type:`geojson`,data:e}),this.addLayer({id:`selected-lyr`,type:`line`,paint:{"line-color":`#00ffff`,"line-width":2},source:t})}clearSelect(){let e=`selected-lyr`;this.getLayer(e)&&(this.removeLayer(e),this.removeSource(`selected-ds`))}findValidBeforeId(e){let t=this.getLayerList(),n=t.findIndex(t=>t.options.id===e);if(n>-1)for(let e=n;e<t.length;e++){let n=this.getLayer(t[e].options.id);if(n)return n.id}}getLayerList(){let e=[];return g(e,this.layers),e}destory(){this.fire(b.MAPDESTRORY,{map:this}),this.remove()}},S=(0,t.createContext)({map:null}),C=()=>{let e=(0,t.useContext)(S);if(!e)throw Error(`只能在函数组件中使用`);return e};function w(e){let{mapOptions:n,mapLayerSettting:i,children:a,onMapLoad:o,className:s}=e,c=(0,t.useRef)(null),[l,u]=(0,t.useState)(!1),{current:d}=(0,t.useRef)({map:null});return(0,t.useEffect)(()=>{let e=new x({pitch:0,bearing:0,doubleClickZoom:!1,attributionControl:!1,renderWorldCopies:!1,trackResize:!0,...n,container:c.current,style:{version:8,glyphs:`/font/{fontstack}/{range}.pbf`,sources:{},layers:[]}}),t=()=>{e.load(m(i)),u(!0),o?.(e),d&&(d.map=e)};e.on(`load`,t),e.on(`click`,()=>{console.log(`center:`,e.getCenter(),`zoom:`,e.getZoom())});let r=h(()=>{e.resize()},10);return new ResizeObserver(r).observe(c?.current),()=>{e.off(`load`,t)}},[]),(0,r.jsx)(`div`,{ref:c,className:s??`map-wrapper`,id:`map-wrapper`,children:l&&d&&(0,r.jsx)(S.Provider,{value:d,children:a})})}var T=(0,t.memo)(w),E=(0,t.memo)(e=>{let{style:t,onToggle:n,title:i,icon:a,classname:o}=e;return(0,r.jsx)(`div`,{className:`maplibregl-widget-button ${o||``}`,onClick:()=>n?.(!0),title:i||``,style:{backgroundImage:`url(${a})`,...t}})}),D=(e,t)=>{for(let n of e){if(n.key===t)return n;if(n.children){let e=D(n.children,t);if(e)return e}}return null},O=e=>{let t=[];return e.children&&e.children.length>0&&e.children.forEach(e=>{t.push(e.key),t.push(...O(e))}),t},k=e=>!e.children||e.children.length===0,ee=(e,t)=>t.includes(e.key),te=(e,t)=>{if(k(e))return!1;let n=O(e);if(n.length===0)return!1;let r=n.filter(e=>t.includes(e));return r.length>0&&r.length<n.length},A=(0,t.memo)(e=>{let{node:n,level:i,checkedKeys:a,checkable:o,onCheck:s}=e,[c,l]=(0,t.useState)(!0),u=!k(n),d=ee(n,a),f=te(n,a);return(0,r.jsxs)(`div`,{className:`qm-tree-node`,children:[(0,r.jsxs)(`div`,{className:`qm-tree-node-content`,style:{paddingLeft:i*18},children:[(0,r.jsx)(`span`,{className:`qm-tree-switcher ${u?``:`qm-tree-switcher-noop`} ${c?`qm-tree-switcher-expanded`:``}`,onClick:()=>{u&&l(!c)},children:u&&(0,r.jsx)(`svg`,{viewBox:`0 0 1024 1024`,width:`12`,height:`12`,fill:`currentColor`,children:(0,r.jsx)(`path`,{d:`M715.8 493.5L435.6 213.3c-12.4-12.4-32.8-12.4-45.2 0s-12.4 32.8 0 45.2l245.8 245.8-245.8 245.8c-12.4 12.4-12.4 32.8 0 45.2 6.2 6.2 14.3 9.3 22.6 9.3s16.4-3.1 22.6-9.3l280.2-280.2c12.4-12.4 12.4-32.8 0-45.2z`})})}),o&&(0,r.jsx)(`span`,{className:`qm-tree-checkbox ${d?`qm-tree-checkbox-checked`:``} ${f?`qm-tree-checkbox-indeterminate`:``}`,onClick:()=>{s(n.key)},children:(0,r.jsxs)(`span`,{className:`qm-tree-checkbox-inner`,children:[d&&(0,r.jsx)(`svg`,{viewBox:`0 0 1024 1024`,width:`10`,height:`10`,fill:`white`,children:(0,r.jsx)(`path`,{d:`M912 224l-448 448-192-192-64 64 256 256 512-512z`})}),f&&(0,r.jsx)(`span`,{className:`qm-tree-checkbox-indeterminate-icon`})]})}),(0,r.jsx)(`span`,{className:`qm-tree-node-title`,title:typeof n.title==`string`?n.title:``,children:n.title})]}),u&&c&&(0,r.jsx)(`div`,{className:`qm-tree-children`,children:n.children.map(e=>(0,r.jsx)(A,{node:e,level:i+1,checkedKeys:a,checkable:o,onCheck:s},e.key))})]})}),ne=(0,t.memo)(e=>{let{treeData:n,checkable:i=!1,checkedKeys:a,onCheck:o,style:s}=e,[c,l]=(0,t.useState)([]),u=a!==void 0,d=u?a:c,f=(e,t)=>{let r=D(n,t);if(!r)return e;let i=e.includes(t),a;if(i){let n=O(r),i=new Set([t,...n]);a=e.filter(e=>!i.has(e))}else{let n=O(r);a=Array.from(new Set([...e,t,...n]))}return a},p=(0,t.useCallback)(e=>{if(u){let t=f(d,e);o?.(t)}else l(t=>{let n=f(t,e);return o?.(n),n})},[d,n,u,o]);return(0,r.jsx)(`div`,{className:`qm-tree`,style:s,children:n.map(e=>(0,r.jsx)(A,{node:e,level:0,checkedKeys:d,checkable:i,onCheck:p},e.key))})}),j=(0,t.memo)(e=>{let{style:n,close:i,classname:a,onCallback:o}=e,[s,c]=(0,t.useState)([]),{map:l}=C(),[u,d]=(0,t.useState)([]),f=(0,t.useCallback)((e,t)=>{let n,r=[];return e.forEach(e=>{n=void 0,n=`layers`in e&&e.options.type===`logicGroup`?{title:e.options.name,key:e.options.id,selectable:!1,children:f(e.layers,t)}:{title:e.options.name,key:e.options.id,selectable:!1},n&&r.push(n),e.options.isAdd&&e.options.type!==`logicGroup`&&t.push(e.options.id)}),r},[]),p=e=>{c(e),o?.(e);let t=new Set([...s,...e]),n=new Set([...t].filter(e=>!s.includes(e))),r=new Set([...t].filter(t=>!e.includes(t)));n.forEach(e=>{let t=l?.getLayerWrapper(l.layers,e);t&&`layers`in t?(t.layers.forEach(e=>{e.options.isAdd=!0}),l?.addLayerWrapper(t)):t&&(t.options.isAdd=!0,l?.addLayerWrapper(t))}),r.forEach(e=>{let t=l?.getLayerWrapper(l.layers,e);t&&`layers`in t?(t.layers.forEach(e=>{e.options.isAdd=!1}),l?.removeLayerWrapper(t)):t&&(t.options.isAdd=!1,l?.removeLayerWrapper(t))}),l.layers.forEach(e=>{m(e)})},m=e=>{`layers`in e&&e.layers.findIndex(e=>e.options.type===`logicGroup`)>-1?e.layers.forEach(e=>{m(e)}):`layers`in e&&e.options.type===`logicGroup`&&(e.layers.findIndex(e=>e.options.isAdd)===-1?e.options.isAdd=!1:e.options.isAdd=!0)};return(0,t.useEffect)(()=>{let e=()=>{let e=[];d(l?f(l.layers,e):[]),c(e)},t=h(()=>{e()},300);return l?.on(b.MAPLAYERCHANGED,t),e(),()=>{l?.off(b.MAPLAYERCHANGED,t)}},[]),(0,r.jsx)(`div`,{className:`qm-maplibregl-layerlist ${a||``}`,style:{display:i?`none`:`block`,...n},children:(0,r.jsx)(ne,{checkable:!0,checkedKeys:s,onCheck:e=>p(e),treeData:u,style:{fontSize:12,maxHeight:400,overflowX:`hidden`,overflowY:`auto`}})})}),re=(0,t.memo)(e=>{let{style:n,close:i,classname:a}=e,{map:o}=C(),[s,c]=(0,t.useState)(),l=(0,t.useCallback)((e,t)=>{let n;e.forEach(e=>{if(n=void 0,`layers`in e&&!e.options.legend)l(e.layers,t);else if(e.options.legend&&(e.options.isAdd||`layers`in e&&e.layers.filter(e=>e.options.isAdd).length)){let{title:t,items:i}=e.options.legend;if(i)n=(0,r.jsxs)(`div`,{className:`qm-maplibregl-legend-group`,children:[(0,r.jsx)(`div`,{className:`qm-maplibregl-legend-tilte`,children:t||e.options.name}),i?.map(e=>{let t=o?.images.find(t=>t.id===e.imageId);return(0,r.jsxs)(`div`,{className:`qm-maplibregl-legend-item`,children:[t?(0,r.jsx)(`img`,{src:t.data,alt:``,className:`qm-maplibregl-legend-item-img`}):(0,r.jsx)(`div`,{className:`qm-maplibregl-legend-item-geo`,style:e.style}),(0,r.jsx)(`div`,{className:`qm-maplibregl-legend-item-text`,children:e.text})]},e.text)})]},e.options.id);else{let{style:i,imageId:a,text:s}=e.options.legend,c=o?.images.find(e=>e.id===a);n=(0,r.jsxs)(`div`,{className:`qm-maplibregl-legend-item`,children:[c?(0,r.jsx)(`img`,{src:c.data,alt:``,className:`qm-maplibregl-legend-item-img`}):(0,r.jsx)(`div`,{className:`qm-maplibregl-legend-item-geo`,style:i}),(0,r.jsx)(`div`,{className:`qm-maplibregl-legend-item-text`,children:s||e.options.name})]},s||t||e.options.id)}}else n=void 0;n&&t.push(n)})},[]);return(0,t.useEffect)(()=>{let e=()=>{let e=[];l(o.layers,e),c(e)},t=h(()=>{e()},200);return o?.on(b.MAPLAYERCHANGED,t),e(),()=>{o?.off(b.MAPLAYERCHANGED,t)}},[]),(0,r.jsxs)(`div`,{className:`qm-maplibregl-legend ${a||``}`,style:{display:i?`none`:`block`,...n},children:[(0,r.jsx)(`div`,{className:`qm-maplibregl-legend-title`,children:`图例`}),s]})}),M={JPEG:`jpg`,PNG:`png`,PDF:`pdf`,SVG:`svg`},N={mm:`mm`},P={A2:[594,420],A3:[420,297],A4:[297,210],A5:[210,148],A6:[148,105],B2:[707,500],B3:[500,353],B4:[353,250],B5:[250,176],B6:[176,125],Letter:[279,216]},F={横向:`landscape`,纵向:`portrait`},I={72:72,96:96,200:200,300:300,400:400},ie=class{map;svgCanvas;constructor(e){this.map=e,this.svgCanvas=null}create(){if(!this.map)return;let e=this.map.getCanvasContainer(),t=this.map.getCanvas().clientWidth,n=this.map.getCanvas().clientHeight,r=document.createElementNS(`http://www.w3.org/2000/svg`,`svg`);r.setAttribute(`class`,`qm-print-crosshair`),r.style.cssText=`position:absolute;top:0;left:0;width:${t}px;height:${n}px;pointer-events:none;`;let i=t/2,a=n/2,o=document.createElementNS(`http://www.w3.org/2000/svg`,`line`);o.setAttribute(`x1`,`${i}`),o.setAttribute(`y1`,`0`),o.setAttribute(`x2`,`${i}`),o.setAttribute(`y2`,`${n}`),o.setAttribute(`stroke`,`#dddddd`),o.setAttribute(`stroke-width`,`2`),o.setAttribute(`stroke-dasharray`,`5,5`);let s=document.createElementNS(`http://www.w3.org/2000/svg`,`line`);s.setAttribute(`x1`,`0`),s.setAttribute(`y1`,`${a}`),s.setAttribute(`x2`,`${t}`),s.setAttribute(`y2`,`${a}`),s.setAttribute(`stroke`,`#dddddd`),s.setAttribute(`stroke-width`,`2`),s.setAttribute(`stroke-dasharray`,`5,5`),r.appendChild(o),r.appendChild(s),e.appendChild(r),this.svgCanvas=r}destroy(){this.svgCanvas?.remove(),this.svgCanvas=null,this.map=null}},ae=class{map;svgCanvas;path;constructor(e){this.map=e,this.svgCanvas=null,this.path=null}updateArea(e,t,n=N.mm){if(!this.map||!this.svgCanvas)return;let r=this.map.getCanvas().clientWidth,i=this.map.getCanvas().clientHeight,a=this.toPixels(e,n),o=this.toPixels(t,n),s=r/a,c=i/o,l=Math.min(s,c,1),u=a*l,d=o*l,f=(r-u)/2,p=(i-d)/2,m=f+u,h=p+d,g=`M 0 0 L ${r} 0 L ${r} ${i} L 0 ${i} Z M ${f} ${p} L ${m} ${p} L ${m} ${h} L ${f} ${h} Z`;this.path?.setAttribute(`d`,g)}create(){if(!this.map)return;let e=this.map.getCanvasContainer(),t=this.map.getCanvas().clientWidth,n=this.map.getCanvas().clientHeight,r=document.createElementNS(`http://www.w3.org/2000/svg`,`svg`);r.style.cssText=`position:absolute;top:0;left:0;width:${t}px;height:${n}px;pointer-events:none;`;let i=document.createElementNS(`http://www.w3.org/2000/svg`,`path`);i.setAttribute(`fill`,`#888888`),i.setAttribute(`fill-opacity`,`0.5`),i.setAttribute(`stroke-width`,`0`),i.setAttribute(`fill-rule`,`evenodd`),r.appendChild(i),e.appendChild(r),this.svgCanvas=r,this.path=i}destroy(){this.svgCanvas?.remove(),this.svgCanvas=null,this.path=null,this.map=null}toPixels(e,t){return t===N.mm?96/25.4*e:96*e}},oe=class{toPNG(e,t){e.toBlob(e=>{if(e){let n=URL.createObjectURL(e),r=document.createElement(`a`);r.href=n,r.download=t,r.click(),URL.revokeObjectURL(n)}})}toJPEG(e,t,n=.85){let r=document.createElement(`canvas`);r.width=e.width,r.height=e.height;let i=r.getContext(`2d`);i&&(i.fillStyle=`#FFFFFF`,i.fillRect(0,0,r.width,r.height),i.drawImage(e,0,0));let a=r.toDataURL(`image/jpeg`,Math.max(0,Math.min(1,n))),o=document.createElement(`a`);o.href=a,o.download=t,o.click()}},L=`<svg width="800px" height="800px" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--gis" preserveAspectRatio="xMidYMid meet"><path d="M47.655 1.634l-35 95c-.828 2.24 1.659 4.255 3.68 2.98l33.667-21.228l33.666 21.228c2.02 1.271 4.503-.74 3.678-2.98l-35-95C51.907.514 51.163.006 50 .008c-1.163.001-1.99.65-2.345 1.626zm-.155 14.88v57.54L19.89 91.461z" fill="none" stroke="white" stroke-width="1.5"/><path d="M47.655 1.634l-35 95c-.828 2.24 1.659 4.255 3.68 2.98l33.667-21.228l33.666 21.228c2.02 1.271 4.503-.74 3.678-2.98l-35-95C51.907.514 51.163.006 50 .008c-1.163.001-1.99.65-2.345 1.626zm-.155 14.88v57.54L19.89 91.461z" fill="#000000" fill-rule="evenodd"></path></svg>`,se={image:L,imageName:`gl-export-north-icon`,imageSizeFraction:.05,visibility:`visible`,position:`top-right`},ce=class{options;constructor(e){this.options={...se,...e,image:e?.image??L}}async addToMap(e,t,n){let r=this.options.visibility??`visible`;e.getZoom()<2&&t>n&&(r=`none`),await this.addNorthIconImage(e);let i=this.getIconWidth(e,this.options.imageSizeFraction??.08)*.8,a=this.getElementPosition(e,this.options.position??`top-right`,i),o=e.unproject(a),s=this.options.imageName??`gl-export-north-icon`;e.addSource(s,{type:`geojson`,data:{type:`Feature`,geometry:{type:`Point`,coordinates:[o.lng,o.lat]},properties:{}}}),e.addLayer({id:s,source:s,type:`symbol`,layout:{"icon-image":s,"icon-size":1,"icon-rotate":e.getBearing()*-1,"icon-allow-overlap":!0,"icon-ignore-placement":!0,visibility:r},paint:{}})}async addNorthIconImage(e){let t=this.getIconWidth(e,this.options.imageSizeFraction??.08);return new Promise(n=>{let r=new Image(t,t);r.onload=()=>{this.options.imageName&&e.addImage(this.options.imageName,r),n()};function i(e){return`data:image/svg+xml;charset=utf-8,`+encodeURIComponent(e)}this.options.image&&(r.src=i(this.options.image))})}getIconWidth(e,t){let n=e.getContainer(),r=parseInt(n.style.width.replace(`px`,``));return parseInt(`${r*t}`)}getElementPosition(e,t,n=0){let r=e.getContainer(),i=0,a=0;switch(t){case`top-left`:i=0+n,a=0+n;break;case`top-right`:i=parseInt(r.style.width.replace(`px`,``))-n,a=0+n;break;case`bottom-left`:i=0+n,a=parseInt(r.style.height.replace(`px`,``))-n;break;case`bottom-right`:i=parseInt(r.style.width.replace(`px`,``))-n,a=parseInt(r.style.height.replace(`px`,``))-n;break;default:break}return[i,a]}updateOptions(e){this.options={...this.options,...e,image:e.image??this.options.image}}},le={"circle-radius":8,"circle-color":`red`,"circle-stroke-width":1,"circle-stroke-color":`black`},ue=`maplibregl-marker`,de=class{sourceMap;renderMap;markerClassName;markerCirclePaint;constructor(e,t,n){this.sourceMap=e,this.renderMap=t,this.markerClassName=n?.markerClassName??ue,this.markerCirclePaint={...le,...n?.markerCirclePaint}}getMarkers(){return this.sourceMap.getCanvasContainer().getElementsByClassName(this.markerClassName)}renderMarkers(){let e=this.getMarkers(),t=e.length;if(t===0)return!1;for(let n=0;n<t;n++){let t=e.item(n);if(!t)continue;let r=t.getAttribute(`style`);if(!r)continue;let i=r.match(/translate\(([^,]+)px,\s*([^,]+)px\)/);if(!i)continue;let a=parseInt(i[1]),o=parseInt(i[2]),s=this.sourceMap.unproject([a,o]),c=`print-marker-${n}`;this.renderMap.addSource(c,{type:`geojson`,data:{type:`Point`,coordinates:[s.lng,s.lat]}}),this.renderMap.addLayer({id:c,source:c,type:`circle`,paint:this.markerCirclePaint})}return!0}},fe=class{width;height;unit;constructor(e,t,n){this.width=e,this.height=t,this.unit=n}generate(e,t){let n=this.buildPDF(e),r=new Blob([n],{type:`application/pdf`}),i=URL.createObjectURL(r),a=document.createElement(`a`);a.href=i,a.download=t,a.click(),URL.revokeObjectURL(i)}buildPDF(e){let t=this.unit===N.mm?this.width*2.83465:this.width*72,n=this.unit===N.mm?this.height*2.83465:this.height*72,r=document.createElement(`canvas`);r.width=e.width,r.height=e.height;let i=r.getContext(`2d`);i&&(i.fillStyle=`#FFFFFF`,i.fillRect(0,0,r.width,r.height),i.drawImage(e,0,0));let a=r.toDataURL(`image/jpeg`,.92).split(`,`)[1],o=atob(a),s=new Uint8Array(o.length);for(let e=0;e<o.length;e++)s[e]=o.charCodeAt(e);return this.createPDFStructure(t,n,e.width,e.height,s)}createPDFStructure(e,t,n,r,i){let a=Math.round(e),o=Math.round(t),s=i.length,c=0,l=c;c+=49;let u=c;c+=57;let d=`3 0 obj\n<< /Type /Page /Parent 2 0 R /MediaBox [0 0 ${a} ${o}] /Contents 4 0 R /Resources << /XObject << /Im0 5 0 R >> >> >>\nendobj\n`,f=c;c+=d.length;let p=`q\n${a} 0 0 ${o} 0 0 cm\n/Im0 Do\nQ\n`,m=`4 0 obj\n<< /Length ${p.length} >>\nstream\n${p}endstream\nendobj\n`,h=c;c+=m.length;let g=`5 0 obj\n<< /Type /XObject /Subtype /Image /Width ${n} /Height ${r} /ColorSpace /DeviceRGB /BitsPerComponent 8 /Filter /DCTDecode /Length ${s} >>\nstream\n`,_=c;c+=g.length+s+18;let v=c,y=`xref\n0 6\n0000000000 65535 f \n${String(l).padStart(10,`0`)} 00000 n \n${String(u).padStart(10,`0`)} 00000 n \n${String(f).padStart(10,`0`)} 00000 n \n${String(h).padStart(10,`0`)} 00000 n \n${String(_).padStart(10,`0`)} 00000 n \n`,b=`trailer\n<< /Size 6 /Root 1 0 R >>\nstartxref\n${v}\n%%EOF`,x=new TextEncoder,S=[x.encode(`%PDF-1.4
+(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require("react"),require("maplibre-gl"),require("react/jsx-runtime"),require("react-dom"),require("@mapbox/mapbox-gl-draw")):typeof define==`function`&&define.amd?define([`exports`,`react`,`maplibre-gl`,`react/jsx-runtime`,`react-dom`,`@mapbox/mapbox-gl-draw`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.QmMap={},e.react,e.maplibre_gl,e.react_jsx_runtime,e[`react-dom`],e._mapbox_mapbox_gl_draw))})(this,function(e,t,n,r,i,a){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var o=Object.create,s=Object.defineProperty,c=Object.getOwnPropertyDescriptor,l=Object.getOwnPropertyNames,u=Object.getPrototypeOf,d=Object.prototype.hasOwnProperty,f=(e,t,n,r)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var i=l(t),a=0,o=i.length,u;a<o;a++)u=i[a],!d.call(e,u)&&u!==n&&s(e,u,{get:(e=>t[e]).bind(null,u),enumerable:!(r=c(t,u))||r.enumerable});return e},p=(e,t,n)=>(n=e==null?{}:o(u(e)),f(t||!e||!e.__esModule?s(n,`default`,{value:e,enumerable:!0}):n,e));t=p(t,1),a=p(a,1);function m(e,t=new WeakMap){if(typeof e!=`object`||!e)return e;if(t.has(e))return t.get(e);let n;return e instanceof Date?n=new Date(e.getTime()):e instanceof RegExp?(n=new RegExp(e.source,e.flags),n.lastIndex=e.lastIndex):e instanceof Map?(n=new Map,t.set(e,n),e.forEach((e,r)=>{n.set(m(r,t),m(e,t))})):e instanceof Set?(n=new Set,t.set(e,n),e.forEach(e=>{n.add(m(e,t))})):Array.isArray(e)?(n=[],t.set(e,n),e.forEach((e,r)=>{n[r]=m(e,t)})):(n=Object.create(Object.getPrototypeOf(e)),t.set(e,n),Reflect.ownKeys(e).forEach(r=>{let i=e[r];n[r]=m(i,t)})),n}var h=(e,t)=>{let n=null;return r=>{n&&clearTimeout(n),n=setTimeout(()=>{e(r)},t)}},g=(e,t)=>{Array.isArray(t)&&t.length>0&&t.forEach(t=>{e.push(t),t.layers instanceof Array&&g(e,t.layers)})},_=class{_options;get options(){return this._options}constructor(e){this._options=e}onAdd(e,t){if(this._options.isAdd===!1){this._options.isAdd=!1;return}t=e.findValidBeforeId(this._options.id),this.add(e,t),this._options.isAdd=!0}onRemove(e,t){if(this._options.isAdd)return;e.getLayer(this._options.id)&&e.removeLayer(this._options.id);let n=this._options.id+`-ds`;t&&e.removeSource(n),this._options.isAdd=!1}},v=class extends _{constructor(e){super(e),this._options=e}add(e,t){let{id:n,source:r}=this._options,i=this._options.id+`-ds`;typeof r==`string`&&(i=r),!e.getSource(i)&&r&&typeof r!=`string`&&e.addSource(i,r);let a=e.getLayer(n),o=e.getSource(i);if(!a&&o){let n={...this._options,source:i};e.addLayer(n,t)}}},y=class e{_options;get options(){return this._options}_layers=[];get layers(){return this._layers}constructor(t){this._options=t,t.layers.forEach(t=>{let n;n=`layers`in t?new e(t):new v(t),this._layers.push(n)})}onAdd(e,t){this._layers.forEach(n=>{e.addLayerWrapper(n,t)}),this.updateOptions()}onRemove(e){this._layers.forEach(t=>{e.removeLayerWrapper(t,!1)}),this.updateOptions()}updateOptions(){let e=this._layers.findIndex(e=>e.options.isAdd)>-1;this._options.isAdd=e}},b={MAPINITED:`MAPINITED`,MAPCLICKED:`MAPCLICKED`,MAPLAYERCHANGED:`MAPLAYERCHANGED`,MAPDESTRORY:`MAPDESTRORY`},x=class extends n.Map{_id;get id(){return this._id}_options;get options(){return this._options}_mapLayerSetting;get mapLayerSetting(){return this._mapLayerSetting}_images=[];get images(){return this._images}_layers=[];get layers(){return this._layers}constructor(e){super(e),this._options=e,this._id=e.id,this._mapLayerSetting=[],this.fire(b.MAPINITED,{map:this})}getLayerWrapper(e,t){for(let n of e)if(n.options.id===t)return n;else if(`layers`in n){let e=this.getLayerWrapper(n.layers,t);if(e)return e}}addLayerWrapper(e,t){e.onAdd(this,t),this.fire(b.MAPLAYERCHANGED,{map:this,layer:e})}removeLayerWrapper(e,t){e.onRemove(this,t),this.fire(b.MAPLAYERCHANGED,{map:this,layer:e})}load(e){this._mapLayerSetting=e,e.forEach(e=>{let t;t=`layers`in e?new y(e):new v(e),this.addLayerWrapper(t),this._layers.push(t)})}selectFeature(e){this.clearSelect();let t=`selected-ds`;this.addSource(t,{type:`geojson`,data:e}),this.addLayer({id:`selected-lyr`,type:`line`,paint:{"line-color":`#00ffff`,"line-width":2},source:t})}clearSelect(){let e=`selected-lyr`;this.getLayer(e)&&(this.removeLayer(e),this.removeSource(`selected-ds`))}findValidBeforeId(e){let t=this.getLayerList(),n=t.findIndex(t=>t.options.id===e);if(n>-1)for(let e=n;e<t.length;e++){let n=this.getLayer(t[e].options.id);if(n)return n.id}}getLayerList(){let e=[];return g(e,this.layers),e}destory(){this.fire(b.MAPDESTRORY,{map:this}),this.remove()}},S=(0,t.createContext)({map:null}),C=()=>{let e=(0,t.useContext)(S);if(!e)throw Error(`只能在函数组件中使用`);return e};function w(e){let{mapOptions:n,mapLayerSettting:i,children:a,onMapLoad:o,className:s}=e,c=(0,t.useRef)(null),[l,u]=(0,t.useState)(!1),{current:d}=(0,t.useRef)({map:null});return(0,t.useEffect)(()=>{let e=new x({pitch:0,bearing:0,doubleClickZoom:!1,attributionControl:!1,renderWorldCopies:!1,trackResize:!0,...n,container:c.current,style:{version:8,glyphs:`/font/{fontstack}/{range}.pbf`,sources:{},layers:[]}}),t=()=>{e.load(m(i)),u(!0),o?.(e),d&&(d.map=e)};e.on(`load`,t),e.on(`click`,()=>{console.log(`center:`,e.getCenter(),`zoom:`,e.getZoom())});let r=h(()=>{e.resize()},10);return new ResizeObserver(r).observe(c?.current),()=>{e.off(`load`,t)}},[]),(0,r.jsx)(`div`,{ref:c,className:s??`map-wrapper`,id:`map-wrapper`,children:l&&d&&(0,r.jsx)(S.Provider,{value:d,children:a})})}var T=(0,t.memo)(w),E=(0,t.memo)(e=>{let{style:t,onToggle:n,title:i,icon:a,classname:o}=e;return(0,r.jsx)(`div`,{className:`maplibregl-widget-button ${o||``}`,onClick:()=>n?.(!0),title:i||``,style:{backgroundImage:`url(${a})`,...t}})}),D=(e,t)=>{for(let n of e){if(n.key===t)return n;if(n.children){let e=D(n.children,t);if(e)return e}}return null},O=e=>{let t=[];return e.children&&e.children.length>0&&e.children.forEach(e=>{t.push(e.key),t.push(...O(e))}),t},k=e=>!e.children||e.children.length===0,ee=(e,t)=>t.includes(e.key),te=(e,t)=>{if(k(e))return!1;let n=O(e);if(n.length===0)return!1;let r=n.filter(e=>t.includes(e));return r.length>0&&r.length<n.length},A=(0,t.memo)(e=>{let{node:n,level:i,checkedKeys:a,checkable:o,onCheck:s}=e,[c,l]=(0,t.useState)(!0),u=!k(n),d=ee(n,a),f=te(n,a);return(0,r.jsxs)(`div`,{className:`qm-tree-node`,children:[(0,r.jsxs)(`div`,{className:`qm-tree-node-content`,style:{paddingLeft:i*18},children:[(0,r.jsx)(`span`,{className:`qm-tree-switcher ${u?``:`qm-tree-switcher-noop`} ${c?`qm-tree-switcher-expanded`:``}`,onClick:()=>{u&&l(!c)},children:u&&(0,r.jsx)(`svg`,{viewBox:`0 0 1024 1024`,width:`12`,height:`12`,fill:`currentColor`,children:(0,r.jsx)(`path`,{d:`M715.8 493.5L435.6 213.3c-12.4-12.4-32.8-12.4-45.2 0s-12.4 32.8 0 45.2l245.8 245.8-245.8 245.8c-12.4 12.4-12.4 32.8 0 45.2 6.2 6.2 14.3 9.3 22.6 9.3s16.4-3.1 22.6-9.3l280.2-280.2c12.4-12.4 12.4-32.8 0-45.2z`})})}),o&&(0,r.jsx)(`span`,{className:`qm-tree-checkbox ${d?`qm-tree-checkbox-checked`:``} ${f?`qm-tree-checkbox-indeterminate`:``}`,onClick:()=>{s(n.key)},children:(0,r.jsxs)(`span`,{className:`qm-tree-checkbox-inner`,children:[d&&(0,r.jsx)(`svg`,{viewBox:`0 0 1024 1024`,width:`10`,height:`10`,fill:`white`,children:(0,r.jsx)(`path`,{d:`M912 224l-448 448-192-192-64 64 256 256 512-512z`})}),f&&(0,r.jsx)(`span`,{className:`qm-tree-checkbox-indeterminate-icon`})]})}),(0,r.jsx)(`span`,{className:`qm-tree-node-title`,title:typeof n.title==`string`?n.title:``,children:n.title})]}),u&&c&&(0,r.jsx)(`div`,{className:`qm-tree-children`,children:n.children.map(e=>(0,r.jsx)(A,{node:e,level:i+1,checkedKeys:a,checkable:o,onCheck:s},e.key))})]})}),ne=(0,t.memo)(e=>{let{treeData:n,checkable:i=!1,checkedKeys:a,onCheck:o,style:s}=e,[c,l]=(0,t.useState)([]),u=a!==void 0,d=u?a:c,f=(e,t)=>{let r=D(n,t);if(!r)return e;let i=e.includes(t),a;if(i){let n=O(r),i=new Set([t,...n]);a=e.filter(e=>!i.has(e))}else{let n=O(r);a=Array.from(new Set([...e,t,...n]))}return a},p=(0,t.useCallback)(e=>{if(u){let t=f(d,e);o?.(t)}else l(t=>{let n=f(t,e);return o?.(n),n})},[d,n,u,o]);return(0,r.jsx)(`div`,{className:`qm-tree`,style:s,children:n.map(e=>(0,r.jsx)(A,{node:e,level:0,checkedKeys:d,checkable:i,onCheck:p},e.key))})}),j=(0,t.memo)(e=>{let{style:n,close:i,classname:a,onCallback:o}=e,[s,c]=(0,t.useState)([]),{map:l}=C(),[u,d]=(0,t.useState)([]),f=(0,t.useCallback)((e,t)=>{let n,r=[];return e.forEach(e=>{n=void 0,n=`layers`in e&&e.options.type===`logicGroup`?{title:e.options.name,key:e.options.id,selectable:!1,children:f(e.layers,t)}:{title:e.options.name,key:e.options.id,selectable:!1},n&&r.push(n),e.options.isAdd&&e.options.type!==`logicGroup`&&t.push(e.options.id)}),r},[]),p=e=>{c(e),o?.(e);let t=new Set([...s,...e]),n=new Set([...t].filter(e=>!s.includes(e))),r=new Set([...t].filter(t=>!e.includes(t)));n.forEach(e=>{let t=l?.getLayerWrapper(l.layers,e);t&&`layers`in t?(t.layers.forEach(e=>{e.options.isAdd=!0}),l?.addLayerWrapper(t)):t&&(t.options.isAdd=!0,l?.addLayerWrapper(t))}),r.forEach(e=>{let t=l?.getLayerWrapper(l.layers,e);t&&`layers`in t?(t.layers.forEach(e=>{e.options.isAdd=!1}),l?.removeLayerWrapper(t)):t&&(t.options.isAdd=!1,l?.removeLayerWrapper(t))}),l.layers.forEach(e=>{m(e)})},m=e=>{`layers`in e&&e.layers.findIndex(e=>e.options.type===`logicGroup`)>-1?e.layers.forEach(e=>{m(e)}):`layers`in e&&e.options.type===`logicGroup`&&(e.layers.findIndex(e=>e.options.isAdd)===-1?e.options.isAdd=!1:e.options.isAdd=!0)};return(0,t.useEffect)(()=>{let e=()=>{let e=[];d(l?f(l.layers,e):[]),c(e)},t=h(()=>{e()},300);return l?.on(b.MAPLAYERCHANGED,t),e(),()=>{l?.off(b.MAPLAYERCHANGED,t)}},[]),(0,r.jsx)(`div`,{className:`qm-maplibregl-layerlist ${a||``}`,style:{display:i?`none`:`block`,...n},children:(0,r.jsx)(ne,{checkable:!0,checkedKeys:s,onCheck:e=>p(e),treeData:u})})}),re=(0,t.memo)(e=>{let{style:n,close:i,classname:a}=e,{map:o}=C(),[s,c]=(0,t.useState)(),l=(0,t.useCallback)((e,t)=>{let n;e.forEach(e=>{if(n=void 0,`layers`in e&&!e.options.legend)l(e.layers,t);else if(e.options.legend&&(e.options.isAdd||`layers`in e&&e.layers.filter(e=>e.options.isAdd).length)){let{title:t,items:i}=e.options.legend;if(i)n=(0,r.jsxs)(`div`,{className:`qm-maplibregl-legend-group`,children:[(0,r.jsx)(`div`,{className:`qm-maplibregl-legend-tilte`,children:t||e.options.name}),i?.map(e=>{let t=o?.images.find(t=>t.id===e.imageId);return(0,r.jsxs)(`div`,{className:`qm-maplibregl-legend-item`,children:[t?(0,r.jsx)(`img`,{src:t.data,alt:``,className:`qm-maplibregl-legend-item-img`}):(0,r.jsx)(`div`,{className:`qm-maplibregl-legend-item-geo`,style:e.style}),(0,r.jsx)(`div`,{className:`qm-maplibregl-legend-item-text`,children:e.text})]},e.text)})]},e.options.id);else{let{style:i,imageId:a,text:s}=e.options.legend,c=o?.images.find(e=>e.id===a);n=(0,r.jsxs)(`div`,{className:`qm-maplibregl-legend-item`,children:[c?(0,r.jsx)(`img`,{src:c.data,alt:``,className:`qm-maplibregl-legend-item-img`}):(0,r.jsx)(`div`,{className:`qm-maplibregl-legend-item-geo`,style:i}),(0,r.jsx)(`div`,{className:`qm-maplibregl-legend-item-text`,children:s||e.options.name})]},s||t||e.options.id)}}else n=void 0;n&&t.push(n)})},[]);return(0,t.useEffect)(()=>{let e=()=>{let e=[];l(o.layers,e),c(e)},t=h(()=>{e()},200);return o?.on(b.MAPLAYERCHANGED,t),e(),()=>{o?.off(b.MAPLAYERCHANGED,t)}},[]),(0,r.jsxs)(`div`,{className:`qm-maplibregl-legend ${a||``}`,style:{display:i?`none`:`block`,...n},children:[(0,r.jsx)(`div`,{className:`qm-maplibregl-legend-title`,children:`图例`}),s]})}),M={JPEG:`jpg`,PNG:`png`,PDF:`pdf`,SVG:`svg`},N={mm:`mm`},P={A2:[594,420],A3:[420,297],A4:[297,210],A5:[210,148],A6:[148,105],B2:[707,500],B3:[500,353],B4:[353,250],B5:[250,176],B6:[176,125],Letter:[279,216]},F={横向:`landscape`,纵向:`portrait`},I={72:72,96:96,200:200,300:300,400:400},ie=class{map;svgCanvas;constructor(e){this.map=e,this.svgCanvas=null}create(){if(!this.map)return;let e=this.map.getCanvasContainer(),t=this.map.getCanvas().clientWidth,n=this.map.getCanvas().clientHeight,r=document.createElementNS(`http://www.w3.org/2000/svg`,`svg`);r.setAttribute(`class`,`qm-print-crosshair`),r.style.cssText=`position:absolute;top:0;left:0;width:${t}px;height:${n}px;pointer-events:none;`;let i=t/2,a=n/2,o=document.createElementNS(`http://www.w3.org/2000/svg`,`line`);o.setAttribute(`x1`,`${i}`),o.setAttribute(`y1`,`0`),o.setAttribute(`x2`,`${i}`),o.setAttribute(`y2`,`${n}`),o.setAttribute(`stroke`,`#dddddd`),o.setAttribute(`stroke-width`,`2`),o.setAttribute(`stroke-dasharray`,`5,5`);let s=document.createElementNS(`http://www.w3.org/2000/svg`,`line`);s.setAttribute(`x1`,`0`),s.setAttribute(`y1`,`${a}`),s.setAttribute(`x2`,`${t}`),s.setAttribute(`y2`,`${a}`),s.setAttribute(`stroke`,`#dddddd`),s.setAttribute(`stroke-width`,`2`),s.setAttribute(`stroke-dasharray`,`5,5`),r.appendChild(o),r.appendChild(s),e.appendChild(r),this.svgCanvas=r}destroy(){this.svgCanvas?.remove(),this.svgCanvas=null,this.map=null}},ae=class{map;svgCanvas;path;constructor(e){this.map=e,this.svgCanvas=null,this.path=null}updateArea(e,t,n=N.mm){if(!this.map||!this.svgCanvas)return;let r=this.map.getCanvas().clientWidth,i=this.map.getCanvas().clientHeight,a=this.toPixels(e,n),o=this.toPixels(t,n),s=r/a,c=i/o,l=Math.min(s,c,1),u=a*l,d=o*l,f=(r-u)/2,p=(i-d)/2,m=f+u,h=p+d,g=`M 0 0 L ${r} 0 L ${r} ${i} L 0 ${i} Z M ${f} ${p} L ${m} ${p} L ${m} ${h} L ${f} ${h} Z`;this.path?.setAttribute(`d`,g)}create(){if(!this.map)return;let e=this.map.getCanvasContainer(),t=this.map.getCanvas().clientWidth,n=this.map.getCanvas().clientHeight,r=document.createElementNS(`http://www.w3.org/2000/svg`,`svg`);r.style.cssText=`position:absolute;top:0;left:0;width:${t}px;height:${n}px;pointer-events:none;`;let i=document.createElementNS(`http://www.w3.org/2000/svg`,`path`);i.setAttribute(`fill`,`#888888`),i.setAttribute(`fill-opacity`,`0.5`),i.setAttribute(`stroke-width`,`0`),i.setAttribute(`fill-rule`,`evenodd`),r.appendChild(i),e.appendChild(r),this.svgCanvas=r,this.path=i}destroy(){this.svgCanvas?.remove(),this.svgCanvas=null,this.path=null,this.map=null}toPixels(e,t){return t===N.mm?96/25.4*e:96*e}},oe=class{toPNG(e,t){e.toBlob(e=>{if(e){let n=URL.createObjectURL(e),r=document.createElement(`a`);r.href=n,r.download=t,r.click(),URL.revokeObjectURL(n)}})}toJPEG(e,t,n=.85){let r=document.createElement(`canvas`);r.width=e.width,r.height=e.height;let i=r.getContext(`2d`);i&&(i.fillStyle=`#FFFFFF`,i.fillRect(0,0,r.width,r.height),i.drawImage(e,0,0));let a=r.toDataURL(`image/jpeg`,Math.max(0,Math.min(1,n))),o=document.createElement(`a`);o.href=a,o.download=t,o.click()}},L=`<svg width="800px" height="800px" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--gis" preserveAspectRatio="xMidYMid meet"><path d="M47.655 1.634l-35 95c-.828 2.24 1.659 4.255 3.68 2.98l33.667-21.228l33.666 21.228c2.02 1.271 4.503-.74 3.678-2.98l-35-95C51.907.514 51.163.006 50 .008c-1.163.001-1.99.65-2.345 1.626zm-.155 14.88v57.54L19.89 91.461z" fill="none" stroke="white" stroke-width="1.5"/><path d="M47.655 1.634l-35 95c-.828 2.24 1.659 4.255 3.68 2.98l33.667-21.228l33.666 21.228c2.02 1.271 4.503-.74 3.678-2.98l-35-95C51.907.514 51.163.006 50 .008c-1.163.001-1.99.65-2.345 1.626zm-.155 14.88v57.54L19.89 91.461z" fill="#000000" fill-rule="evenodd"></path></svg>`,se={image:L,imageName:`gl-export-north-icon`,imageSizeFraction:.05,visibility:`visible`,position:`top-right`},ce=class{options;constructor(e){this.options={...se,...e,image:e?.image??L}}async addToMap(e,t,n){let r=this.options.visibility??`visible`;e.getZoom()<2&&t>n&&(r=`none`),await this.addNorthIconImage(e);let i=this.getIconWidth(e,this.options.imageSizeFraction??.08)*.8,a=this.getElementPosition(e,this.options.position??`top-right`,i),o=e.unproject(a),s=this.options.imageName??`gl-export-north-icon`;e.addSource(s,{type:`geojson`,data:{type:`Feature`,geometry:{type:`Point`,coordinates:[o.lng,o.lat]},properties:{}}}),e.addLayer({id:s,source:s,type:`symbol`,layout:{"icon-image":s,"icon-size":1,"icon-rotate":e.getBearing()*-1,"icon-allow-overlap":!0,"icon-ignore-placement":!0,visibility:r},paint:{}})}async addNorthIconImage(e){let t=this.getIconWidth(e,this.options.imageSizeFraction??.08);return new Promise(n=>{let r=new Image(t,t);r.onload=()=>{this.options.imageName&&e.addImage(this.options.imageName,r),n()};function i(e){return`data:image/svg+xml;charset=utf-8,`+encodeURIComponent(e)}this.options.image&&(r.src=i(this.options.image))})}getIconWidth(e,t){let n=e.getContainer(),r=parseInt(n.style.width.replace(`px`,``));return parseInt(`${r*t}`)}getElementPosition(e,t,n=0){let r=e.getContainer(),i=0,a=0;switch(t){case`top-left`:i=0+n,a=0+n;break;case`top-right`:i=parseInt(r.style.width.replace(`px`,``))-n,a=0+n;break;case`bottom-left`:i=0+n,a=parseInt(r.style.height.replace(`px`,``))-n;break;case`bottom-right`:i=parseInt(r.style.width.replace(`px`,``))-n,a=parseInt(r.style.height.replace(`px`,``))-n;break;default:break}return[i,a]}updateOptions(e){this.options={...this.options,...e,image:e.image??this.options.image}}},le={"circle-radius":8,"circle-color":`red`,"circle-stroke-width":1,"circle-stroke-color":`black`},ue=`maplibregl-marker`,de=class{sourceMap;renderMap;markerClassName;markerCirclePaint;constructor(e,t,n){this.sourceMap=e,this.renderMap=t,this.markerClassName=n?.markerClassName??ue,this.markerCirclePaint={...le,...n?.markerCirclePaint}}getMarkers(){return this.sourceMap.getCanvasContainer().getElementsByClassName(this.markerClassName)}renderMarkers(){let e=this.getMarkers(),t=e.length;if(t===0)return!1;for(let n=0;n<t;n++){let t=e.item(n);if(!t)continue;let r=t.getAttribute(`style`);if(!r)continue;let i=r.match(/translate\(([^,]+)px,\s*([^,]+)px\)/);if(!i)continue;let a=parseInt(i[1]),o=parseInt(i[2]),s=this.sourceMap.unproject([a,o]),c=`print-marker-${n}`;this.renderMap.addSource(c,{type:`geojson`,data:{type:`Point`,coordinates:[s.lng,s.lat]}}),this.renderMap.addLayer({id:c,source:c,type:`circle`,paint:this.markerCirclePaint})}return!0}},fe=class{width;height;unit;constructor(e,t,n){this.width=e,this.height=t,this.unit=n}generate(e,t){let n=this.buildPDF(e),r=new Blob([n],{type:`application/pdf`}),i=URL.createObjectURL(r),a=document.createElement(`a`);a.href=i,a.download=t,a.click(),URL.revokeObjectURL(i)}buildPDF(e){let t=this.unit===N.mm?this.width*2.83465:this.width*72,n=this.unit===N.mm?this.height*2.83465:this.height*72,r=document.createElement(`canvas`);r.width=e.width,r.height=e.height;let i=r.getContext(`2d`);i&&(i.fillStyle=`#FFFFFF`,i.fillRect(0,0,r.width,r.height),i.drawImage(e,0,0));let a=r.toDataURL(`image/jpeg`,.92).split(`,`)[1],o=atob(a),s=new Uint8Array(o.length);for(let e=0;e<o.length;e++)s[e]=o.charCodeAt(e);return this.createPDFStructure(t,n,e.width,e.height,s)}createPDFStructure(e,t,n,r,i){let a=Math.round(e),o=Math.round(t),s=i.length,c=0,l=c;c+=49;let u=c;c+=57;let d=`3 0 obj\n<< /Type /Page /Parent 2 0 R /MediaBox [0 0 ${a} ${o}] /Contents 4 0 R /Resources << /XObject << /Im0 5 0 R >> >> >>\nendobj\n`,f=c;c+=d.length;let p=`q\n${a} 0 0 ${o} 0 0 cm\n/Im0 Do\nQ\n`,m=`4 0 obj\n<< /Length ${p.length} >>\nstream\n${p}endstream\nendobj\n`,h=c;c+=m.length;let g=`5 0 obj\n<< /Type /XObject /Subtype /Image /Width ${n} /Height ${r} /ColorSpace /DeviceRGB /BitsPerComponent 8 /Filter /DCTDecode /Length ${s} >>\nstream\n`,_=c;c+=g.length+s+18;let v=c,y=`xref\n0 6\n0000000000 65535 f \n${String(l).padStart(10,`0`)} 00000 n \n${String(u).padStart(10,`0`)} 00000 n \n${String(f).padStart(10,`0`)} 00000 n \n${String(h).padStart(10,`0`)} 00000 n \n${String(_).padStart(10,`0`)} 00000 n \n`,b=`trailer\n<< /Size 6 /Root 1 0 R >>\nstartxref\n${v}\n%%EOF`,x=new TextEncoder,S=[x.encode(`%PDF-1.4
 `),x.encode(`1 0 obj
 << /Type /Catalog /Pages 2 0 R >>
 endobj

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "qm-map-maplibre-gl",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "license": "MIT",
   "type": "module",
   "main": "dist/qm-map.es.js",