* Preloading the icon image
()
| 492 | * Preloading the icon image |
| 493 | */ |
| 494 | loadMarker() { |
| 495 | return new Promise((resolve, reject) => { |
| 496 | if (!this.markers.length) resolve(true); |
| 497 | const icons = uniqBy(this.markers.map((m) => ({ file: m.img })), 'file'); |
| 498 | |
| 499 | let count = 1; |
| 500 | icons.forEach(async (ico) => { |
| 501 | const icon = ico; |
| 502 | const isUrl = !!url.parse(icon.file).hostname; |
| 503 | try { |
| 504 | // Load marker from remote url |
| 505 | if (isUrl) { |
| 506 | const img = await got.get({ |
| 507 | https: { |
| 508 | rejectUnauthorized: false, |
| 509 | }, |
| 510 | url: icon.file, |
| 511 | responseType: 'buffer', |
| 512 | }); |
| 513 | icon.data = await sharp(img.body).toBuffer(); |
| 514 | } else { |
| 515 | // Load marker from local fs |
| 516 | icon.data = await sharp(icon.file).toBuffer(); |
| 517 | } |
| 518 | } catch (err) { |
| 519 | reject(err); |
| 520 | } |
| 521 | |
| 522 | if (count++ === icons.length) { |
| 523 | // Pre loaded all icons |
| 524 | this.markers.forEach((mark) => { |
| 525 | const marker = mark; |
| 526 | marker.position = [ |
| 527 | this.xToPx(geoutils.lonToX(marker.coord[0], this.zoom)) - marker.offset[0], |
| 528 | this.yToPx(geoutils.latToY(marker.coord[1], this.zoom)) - marker.offset[1], |
| 529 | ]; |
| 530 | const imgData = find(icons, { file: marker.img }); |
| 531 | marker.set(imgData.data); |
| 532 | }); |
| 533 | |
| 534 | resolve(true); |
| 535 | } |
| 536 | }); |
| 537 | }); |
| 538 | } |
| 539 | |
| 540 | /** |
| 541 | * Fetching tile from endpoint |