'handleLocationSelected', 'markerClicked' => 'handleMarkerClicked', 'mapMoved' => 'handleMapMoved', 'zoomChanged' => 'handleZoomChanged' ]; /** * Mount the component */ public function mount( ?float $latitude = null, ?float $longitude = null, ?int $zoom = null, array $markers = [], bool $interactive = true, bool $showControls = true ) { $this->latitude = $latitude; $this->longitude = $longitude; $this->zoom = $zoom ?? $this->zoom; $this->markers = $markers; $this->interactive = $interactive; $this->showControls = $showControls; } /** * Handle when a location is selected */ public function handleLocationSelected(array $location) { $this->selectedLocation = $location; $this->latitude = $location['latitude']; $this->longitude = $location['longitude']; $this->dispatch('location-updated', [ 'latitude' => $this->latitude, 'longitude' => $this->longitude, 'location' => $location ]); } /** * Handle when a marker is clicked */ public function handleMarkerClicked(array $marker) { $this->selectedLocation = $marker; $this->dispatch('marker-selected', [ 'marker' => $marker ]); } /** * Handle when the map is moved */ public function handleMapMoved(float $latitude, float $longitude) { $this->latitude = $latitude; $this->longitude = $longitude; $this->dispatch('map-moved', [ 'latitude' => $latitude, 'longitude' => $longitude ]); } /** * Handle when the zoom level changes */ public function handleZoomChanged(int $zoom) { $this->zoom = $zoom; $this->dispatch('zoom-changed', [ 'zoom' => $zoom ]); } /** * Get the map configuration */ protected function getMapConfig(): array { return [ 'center' => [ 'lat' => $this->latitude, 'lng' => $this->longitude, ], 'zoom' => $this->zoom, 'markers' => $this->markers, 'interactive' => $this->interactive, 'showControls' => $this->showControls, ]; } /** * Render the component */ public function render() { return view('livewire.location.location-map', [ 'mapConfig' => $this->getMapConfig() ]); } }