@here/harp-examples
Version:
harp.gl Examples
1 lines • 5.28 kB
JavaScript
(()=>{"use strict";var e={5410:(e,t,n)=>{t.d=void 0;const o=n(1526),i=n(8957),r=n(5636),l=n(3074),s=n(7210),a=n(3860),c=n(6120);!function(e){const t={tileDependencies:!1};document.body.innerHTML+='\n <style>\n #mouse-picked-result{\n position:absolute;\n bottom:5px;\n border-radius: 5px;\n margin-left:10px;\n padding: 9px 12px;\n background: #37afaa;\n display: inline-block;\n visibility: hidden;\n text-align: left;\n right:50px;\n }\n #mapCanvas {\n top: 0;\n }\n </style>\n <pre id="mouse-picked-result"></pre>\n ';class n extends s.DataProvider{constructor(){super(...arguments),this.enableTileDependencies=!1}connect(){return Promise.resolve()}ready(){return!0}getTile(e,t){const n=new Array,o=10/(1<<e.level);n.push(0,0);for(let e=0;e<4*Math.PI;e+=.1){const t=Math.cos(e)*e*o,i=Math.sin(e)*e*o*10;n.push(t,i)}const r=new i.TileKey(16384,16384,15);return e.mortonCode()===r.mortonCode()?Promise.resolve(new Float32Array([n.length,...n,0])):this.enableTileDependencies&&(e.column>=r.column-3||e.column<=r.column+3)?Promise.resolve(new Float32Array([0,1,r.mortonCode()])):Promise.resolve({})}dispose(){}}class d extends l.Tile{}class u extends s.TileDataSource{constructor(e){super(new s.TileFactory(d),e)}}function p(e,t){const{left:n,top:o}=t.getBoundingClientRect();return{x:e.clientX-Math.floor(n),y:e.clientY-Math.floor(o)}}let h;const b=document.getElementById("mouse-picked-result");let m;!function(e){const s=document.getElementById("mapCanvas"),d=new l.MapView({canvas:s,theme:{lights:[{type:"ambient",color:"#FFFFFF",name:"ambientLight",intensity:.9}],styles:{customStyleSet:[{when:["==",["get","layer"],"line-layer"],technique:"solid-line",attr:{color:"#ff0000",lineWidth:"10px",clipping:!1}}]}},decoderUrl:"decoder.bundle.js"});l.CopyrightElementHandler.install("copyrightNotice",d);const y=new r.MapControls(d);y.tiltEnabled=!1,d.lookAt({target:[0,0],zoomLevel:16});const g=new r.MapControlsUI(y);s.parentElement.appendChild(g.domElement),d.resize(window.innerWidth,window.innerHeight),window.addEventListener("resize",(()=>{d.resize(window.innerWidth,window.innerHeight)}));const w=new n,f=new u({name:"customDatasource",styleSetName:"customStyleSet",tilingScheme:i.webMercatorTilingScheme,dataProvider:w,concurrentDecoderServiceName:c.CUSTOM_DECODER_SERVICE_TYPE,storageLevelOffset:-1});d.addDataSource(f);const v=new o.DebugTileDataSource(i.webMercatorTilingScheme,"debug",20);d.addDataSource(v),s.addEventListener("mouseup",(e=>{const t=p(e,s);var n;n=t,h&&Math.abs(h.x-n.x)<=5&&Math.abs(h.y-n.y)<=5&&function(e,t,n){let o=e.intersectMapObjects(t,n).filter((e=>"background"!==e.intersection.object.userData.dataSource));o.length>1&&(o=o.filter((e=>e!==m))),0!==o.length?(m=o[0],b.style.visibility="visible",b.innerText=JSON.stringify(m.point,void 0,2)):b.style.visibility="hidden"}(d,t.x,t.y)})),s.addEventListener("mousedown",(e=>{h=p(e,s)})),new a.GUI({width:300}).add(t,"tileDependencies").onChange((e=>{w.enableTileDependencies=!w.enableTileDependencies,d.clearTileCache(),d.update()}))}();const y=document.createElement("div");y.style.position="absolute",y.style.cssFloat="right",y.style.top="60px",y.style.right="10px",y.style.backgroundColor="grey",y.innerHTML="\nPan to the left / right until the tile in the center disappears.<br/>\nTo enable usage of the tile dependencies, check the checkbox,<br/>\nthe geometry will now always be visible.\nClicking on the geometry will show a box showing where you clicked.\nIf the tile dependencies checkbox is disabled, this will only work in\nthe center tile, because otherwise we assume that the contents of any\ngiven tile remain in its boundaries.",document.body.appendChild(y)}(t.d||(t.d={}))},4428:e=>{e.exports=THREE}},t={};function n(o){if(t[o])return t[o].exports;var i=t[o]={exports:{}};return e[o].call(i.exports,i,i.exports,n),i.exports}n.m=e,n.x=e=>{},n.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return n.d(t,{a:t}),t},n.d=(e,t)=>{for(var o in t)n.o(t,o)&&!n.o(e,o)&&Object.defineProperty(e,o,{enumerable:!0,get:t[o]})},n.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),n.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),n.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.j=903,(()=>{var e={903:0,738:0},t=[[5410,592]],o=e=>{},i=(i,r)=>{for(var l,s,[a,c,d,u]=r,p=0,h=[];p<a.length;p++)s=a[p],n.o(e,s)&&e[s]&&h.push(e[s][0]),e[s]=0;for(l in c)n.o(c,l)&&(n.m[l]=c[l]);for(d&&d(n),i&&i(r);h.length;)h.shift()();return u&&t.push.apply(t,u),o()},r=self.webpackChunk_here_harp_examples=self.webpackChunk_here_harp_examples||[];function l(){for(var o,i=0;i<t.length;i++){for(var r=t[i],l=!0,s=1;s<r.length;s++){var a=r[s];0!==e[a]&&(l=!1)}l&&(t.splice(i--,1),o=n(n.s=r[0]))}return 0===t.length&&(n.x(),n.x=e=>{}),o}r.forEach(i.bind(null,0)),r.push=i.bind(null,r.push.bind(r));var s=n.x;n.x=()=>(n.x=s||(e=>{}),(o=l)())})(),n.x()})();