helpy4/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich synced 2025-10-17 18:19:27 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

chore(web): improve map pin (#5761)

Browse source 
* chore(web): improve map pin

* zoom level
This commit is contained in:
Alex 2023-12-16 14:21:13 -06:00 • committed by GitHub
parent 67f020380f
commit 62347edf43
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 20 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

18
web/src/lib/components/shared-components/map/map.svelte
View file

@ -20,7 +20,7 @@
import type { GeoJSONSource, LngLatLike, StyleSpecification } from 'maplibre-gl';
import type { Feature, Geometry, GeoJsonProperties, Point } from 'geojson';
import Icon from '$lib/components/elements/icon.svelte';
import { mdiCog } from '@mdi/js';
import { mdiCog, mdiMapMarker } from '@mdi/js';
import { createEventDispatcher } from 'svelte';
export let mapMarkers: MapMarkerResponseDto[];
@ -29,6 +29,7 @@
export let center: LngLatLike | undefined = undefined;
export let simplified = false;
export let clickable = false;
export let useLocationPin = false;
let map: maplibregl.Map;
let marker: maplibregl.Marker | null = null;
@ -165,11 +166,16 @@
$$slots.popup || handleAssetClick(event.detail.feature.properties.id, map);
}}
>
<img
src={api.getAssetThumbnailUrl(feature.properties?.id)}
class="rounded-full w-[60px] h-[60px] border-2 border-immich-primary shadow-lg hover:border-immich-dark-primary transition-all duration-200 hover:scale-150 object-contain bg-immich-primary"
alt={`Image with id ${feature.properties?.id}`}
/>
{#if useLocationPin}
<Icon path={mdiMapMarker} size="60px" class="dark:text-immich-dark-primary text-immich-primary" />
{:else}
<img
src={api.getAssetThumbnailUrl(feature.properties?.id)}
class="rounded-full w-[60px] h-[60px] border-2 border-immich-primary shadow-lg hover:border-immich-dark-primary transition-all duration-200 hover:scale-150 object-cover bg-immich-primary"
alt={`Image with id ${feature.properties?.id}`}
/>
{/if}
{#if $$slots.popup}
<Popup openOn="click" closeOnClickOutside>
<slot name="popup" marker={asMarker(feature)} />