cheesegrits / filament-google-maps

Google Maps package for Filament PHP
234 stars 65 forks source link

Widget - change markers without refresh map #105

Open jcesarbueno opened 4 months ago

jcesarbueno commented 4 months ago

Hi,

How can I change the markers on the map widget without refreshing the whole map?

abdallahisham commented 2 months ago

Having the same issue here, @jcesarbueno did you find a solution?

mikestmike commented 3 weeks ago

Any update here?

kingmaker-agm commented 1 day ago

Any Update on this?

I too am stuck with this Issue.

mikestmike commented 1 day ago

I moved to advanced markers in a livewire component https://console.cloud.google.com/google/maps-hosted/discover/complex-markers?project=trim-odyssey-419813&pli=1

kingmaker-agm commented 1 day ago

@mikestmike Can you help us out by sharing the code?

mikestmike commented 1 day ago

In the class i have a method that fetches locations based on dates whereBetween

View:

<div>
    <div class="w-full">
        <gmp-map center="{{ $mapCenter }}" zoom="10" map-id="sessions" style="height: 350px;">
            @foreach ($locations as $location)
                <gmp-advanced-marker position="{{ $location['latitude'] }}, {{ $location['longitude'] }}"
                    title="{{$location->name}}"></gmp-advanced-marker>
            @endforeach
        </gmp-map>
    </div>
</div>

@push('scripts')
    <script
        src="https://maps.googleapis.com/maps/api/js?key={{ env('GOOGLE_MAPS_API_KEY') }}&loading=async&libraries=marker&v=beta&solution_channel=GMP_CCS_complexmarkers_v3"
        defer></script>
        <style >
            gmp-advanced-marker {
                touch-action: none; 
                position: absolute; 
                left: 0px; 
                pointer-events: none; 
                transform: translate(-50%, -100%) translate(0px, 0px); 
                will-change: transform;
            }
        </style>
@endpush