diff options
author | Anton Tananaev <anton.tananaev@gmail.com> | 2021-06-26 23:17:37 -0700 |
---|---|---|
committer | Anton Tananaev <anton.tananaev@gmail.com> | 2021-06-26 23:17:37 -0700 |
commit | d86a3ef187359fbe83a5dd950295868c4ef39d09 (patch) | |
tree | 9dab403a24a75bc9d25e0c9ae6af29c6d5341682 /modern/src/map/mapUtil.js | |
parent | de199fa668b61ca1def0b8d18de8d666d8148361 (diff) | |
download | etbsa-traccar-web-d86a3ef187359fbe83a5dd950295868c4ef39d09.tar.gz etbsa-traccar-web-d86a3ef187359fbe83a5dd950295868c4ef39d09.tar.bz2 etbsa-traccar-web-d86a3ef187359fbe83a5dd950295868c4ef39d09.zip |
Implement marker colors
Diffstat (limited to 'modern/src/map/mapUtil.js')
-rw-r--r-- | modern/src/map/mapUtil.js | 8 |
1 files changed, 4 insertions, 4 deletions
diff --git a/modern/src/map/mapUtil.js b/modern/src/map/mapUtil.js index 4780940..ef6ff99 100644 --- a/modern/src/map/mapUtil.js +++ b/modern/src/map/mapUtil.js @@ -1,4 +1,5 @@ import wellknown from 'wellknown'; +import canvasTintImage from 'canvas-tint-image'; import circle from '@turf/circle'; export const loadImage = (url) => { @@ -9,7 +10,7 @@ export const loadImage = (url) => { }); }; -export const loadIcon = async (background, url) => { +export const prepareIcon = (background, icon, color) => { const pixelRatio = window.devicePixelRatio; const canvas = document.createElement('canvas'); @@ -21,12 +22,11 @@ export const loadIcon = async (background, url) => { const context = canvas.getContext('2d'); context.drawImage(background, 0, 0, canvas.width, canvas.height); - if (url) { - const image = await loadImage(url); + if (icon) { const iconRatio = 0.5; const imageWidth = canvas.width * iconRatio; const imageHeight = canvas.height * iconRatio; - context.drawImage(image, (canvas.width - imageWidth) / 2, (canvas.height - imageHeight) / 2, imageWidth, imageHeight); + context.drawImage(canvasTintImage(icon, color, 1), (canvas.width - imageWidth) / 2, (canvas.height - imageHeight) / 2, imageWidth, imageHeight); } return context.getImageData(0, 0, canvas.width, canvas.height); |