@here/harp-examples
Version:
harp.gl Examples
1 lines • 4.2 kB
JavaScript
(()=>{"use strict";var e={5399:(e,n,t)=>{n.H=void 0;const o=t(8957),i=t(3074),r=t(2998),a=t(4428),s=t(4565);!function(e){const n=new class{constructor(e,n){this.coordinates=n,this.addHTMLElements(e),this.canvas=document.getElementById("popupLine"),this.context=this.canvas.getContext("2d"),this.canvas.width=window.innerWidth,this.canvas.height=window.innerHeight,window.addEventListener("resize",(()=>{this.canvas.width=window.innerWidth,this.canvas.height=window.innerHeight}))}addHTMLElements(e){document.body.innerHTML+=`\n <style>\n #popupLine {\n position: absolute;\n border: 0;\n left: 0;\n width: 100%;\n height: 100%;\n top: 0;\n overflow: hidden;\n z-index: 1;\n }\n .popup {\n background: #000;\n position: absolute;\n right: 75%;\n bottom: 75%;\n color: #cceeff;\n margin: 0 -1px -1px 0;\n padding: 3px 10px;\n }\n </style>\n <canvas id="popupLine"></canvas>\n <div class="popup">${e}</div>\n `}drawConnectionLine(){if(this.context){const e=this.canvas.width,n=this.canvas.height,t=c.projection.projectPoint(this.coordinates,new a.Vector3).project(c.camera);t.x=(t.x+1)/2*e,t.y=-(t.y-1)/2*n,this.context.lineWidth=2,this.context.clearRect(0,0,e,n),this.context.beginPath(),this.context.moveTo(e/4,n/4),this.context.lineTo(t.x,t.y),this.context.stroke()}}}("One World Trade Center",new o.GeoCoordinates(40.713,-74.013,541.3)),t={target:new o.GeoCoordinates(40.707,-74.01,0),zoomLevel:16,tilt:35,heading:0},c=function(e){const n=document.getElementById("mapCanvas"),t=new i.MapView({canvas:n,theme:"resources/berlin_tilezen_base.json",synchronousRendering:!0});t.renderLabels=!1,i.CopyrightElementHandler.install("copyrightNotice",t),t.resize(window.innerWidth,window.innerHeight),window.addEventListener("resize",(()=>{t.resize(window.innerWidth,window.innerHeight)}));const o=new r.VectorTileDataSource({baseUrl:"https://vector.hereapi.com/v2/vectortiles/base/mc",apiFormat:r.APIFormat.XYZOMV,styleSetName:"tilezen",authenticationCode:s.apikey,authenticationMethod:{method:r.AuthenticationMethod.QueryString,name:"apikey"},copyrightInfo:s.copyrightInfo});return t.addDataSource(o),t}();c.addEventListener(i.MapViewEventNames.Update,(function(){d||(d=!0,requestAnimationFrame(p))}));let d=!1,h=!1;function p(e){h||(d=!1,h=!0,n.drawConnectionLine(),t.heading+=.1,c.lookAt(t),c.renderSync(e),h=!1)}}(n.H||(n.H={}))},4428:e=>{e.exports=THREE}},n={};function t(o){if(n[o])return n[o].exports;var i=n[o]={exports:{}};return e[o].call(i.exports,i,i.exports,t),i.exports}t.m=e,t.x=e=>{},t.n=e=>{var n=e&&e.__esModule?()=>e.default:()=>e;return t.d(n,{a:n}),n},t.d=(e,n)=>{for(var o in n)t.o(n,o)&&!t.o(e,o)&&Object.defineProperty(e,o,{enumerable:!0,get:n[o]})},t.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),t.o=(e,n)=>Object.prototype.hasOwnProperty.call(e,n),t.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},t.j=821,(()=>{var e={821:0,738:0},n=[[5399,592]],o=e=>{},i=(i,r)=>{for(var a,s,[c,d,h,p]=r,l=0,u=[];l<c.length;l++)s=c[l],t.o(e,s)&&e[s]&&u.push(e[s][0]),e[s]=0;for(a in d)t.o(d,a)&&(t.m[a]=d[a]);for(h&&h(t),i&&i(r);u.length;)u.shift()();return p&&n.push.apply(n,p),o()},r=self.webpackChunk_here_harp_examples=self.webpackChunk_here_harp_examples||[];function a(){for(var o,i=0;i<n.length;i++){for(var r=n[i],a=!0,s=1;s<r.length;s++){var c=r[s];0!==e[c]&&(a=!1)}a&&(n.splice(i--,1),o=t(t.s=r[0]))}return 0===n.length&&(t.x(),t.x=e=>{}),o}r.forEach(i.bind(null,0)),r.push=i.bind(null,r.push.bind(r));var s=t.x;t.x=()=>(t.x=s||(e=>{}),(o=a)())})(),t.x()})();