diff options
-rw-r--r-- | src/css/dumbymap.css | 6 | ||||
-rw-r--r-- | src/dumbyUtils.mjs | 6 | ||||
-rw-r--r-- | src/dumbymap.mjs | 9 |
3 files changed, 19 insertions, 2 deletions
diff --git a/src/css/dumbymap.css b/src/css/dumbymap.css index 52d0ded..7aff339 100644 --- a/src/css/dumbymap.css +++ b/src/css/dumbymap.css | |||
@@ -152,6 +152,12 @@ a[href^='http']:not(:has(img))::after, | |||
152 | background-color: #9ee7ea; | 152 | background-color: #9ee7ea; |
153 | } | 153 | } |
154 | 154 | ||
155 | &[data-valid="false"] { | ||
156 | background-color: lightgray; | ||
157 | |||
158 | opacity: 0.7; | ||
159 | } | ||
160 | |||
155 | &:hover, &.drag { | 161 | &:hover, &.drag { |
156 | background-image: none; | 162 | background-image: none; |
157 | 163 | ||
diff --git a/src/dumbyUtils.mjs b/src/dumbyUtils.mjs index 2e71ee6..2f92c18 100644 --- a/src/dumbyUtils.mjs +++ b/src/dumbyUtils.mjs | |||
@@ -165,6 +165,8 @@ export const createGeoLink = (link) => { | |||
165 | 165 | ||
166 | // LeaderLine | 166 | // LeaderLine |
167 | link.onmouseover = () => { | 167 | link.onmouseover = () => { |
168 | if (link.dataset.valid === 'false') return | ||
169 | |||
168 | const anchors = getMarkersFromMaps(link) | 170 | const anchors = getMarkersFromMaps(link) |
169 | anchors | 171 | anchors |
170 | .filter(isAnchorVisible) | 172 | .filter(isAnchorVisible) |
@@ -176,11 +178,13 @@ export const createGeoLink = (link) => { | |||
176 | link.onmouseout = () => removeLeaderLines(link) | 178 | link.onmouseout = () => removeLeaderLines(link) |
177 | link.onclick = (event) => { | 179 | link.onclick = (event) => { |
178 | event.preventDefault() | 180 | event.preventDefault() |
181 | if (link.dataset.valid === 'false') return | ||
182 | |||
179 | removeLeaderLines(link) | 183 | removeLeaderLines(link) |
180 | getMarkersFromMaps(link) | 184 | getMarkersFromMaps(link) |
181 | .forEach(updateMapCameraByMarker([ | 185 | .forEach(updateMapCameraByMarker([ |
182 | Number(link.dataset.lon), | 186 | Number(link.dataset.lon), |
183 | Number(link.dataset.lat) | 187 | Number(link.dataset.lat), |
184 | ])) | 188 | ])) |
185 | } | 189 | } |
186 | return true | 190 | return true |
diff --git a/src/dumbymap.mjs b/src/dumbymap.mjs index 6602f29..974d4a3 100644 --- a/src/dumbymap.mjs +++ b/src/dumbymap.mjs | |||
@@ -179,7 +179,7 @@ export const generateMaps = (container, { | |||
179 | 179 | ||
180 | /** Set CRS and GeoLinks */ | 180 | /** Set CRS and GeoLinks */ |
181 | register(proj4) | 181 | register(proj4) |
182 | fromEPSGCode(crs).then(() => { | 182 | fromEPSGCode(crs).then(projection => { |
183 | const transform = proj4(crs, 'EPSG:4326').forward | 183 | const transform = proj4(crs, 'EPSG:4326').forward |
184 | 184 | ||
185 | Array.from(container.querySelectorAll(geoLinkSelector)) | 185 | Array.from(container.querySelectorAll(geoLinkSelector)) |
@@ -200,6 +200,13 @@ export const generateMaps = (container, { | |||
200 | params.set('q', `${lat},${lon}`) | 200 | params.set('q', `${lat},${lon}`) |
201 | link.search = params | 201 | link.search = params |
202 | 202 | ||
203 | if (projection.getUnits() === 'degrees' && | ||
204 | (lon > 180 || lon < -180 || lat > 90 || lat < -90) | ||
205 | ) { | ||
206 | link.dataset.valid = false | ||
207 | link.title = `Invalid Coordinate, maybe try another crs other than ${crs}` | ||
208 | } | ||
209 | |||
203 | return link | 210 | return link |
204 | }) | 211 | }) |
205 | .forEach(utils.createGeoLink) | 212 | .forEach(utils.createGeoLink) |