README

一个 Filament 字段，用于根据 Google Maps 获取坐标。

基于 Filament Google Maps Picker 的分支

安装

您可以通过 composer 安装此包

composer require aabosham/filament-google-maps-marker

您必须在 .env 文件中定义环境变量 GOOGLE_MAPS_API_KEY 并使用您的 Google Maps API Key

您可以使用以下命令发布配置文件

php artisan vendor:publish --tag="filament-google-maps-marker-config"

这是发布配置文件的内容

return [
    'google_maps_key' => env('GOOGLE_MAPS_API_KEY')
];

可选地，您可以使用以下命令发布视图

php artisan vendor:publish --tag="filament-google-maps-marker-views"

用法

在您的 filament 资源文件中

use AAbosham\FilamentGoogleMapsMarker\Forms\Components\GoogleMapsMarker;

在您的 filament 表单模式中

        GoogleMapsMarker::make('location')

这将显示一个简单的带有标记的 Google Maps 字段，纬度为 0，经度为 0。当您点击地图时，字段值和标记位置会更新到新的坐标。

启用 Google Maps 控制器

使用以下方法启用 Google Maps 控制器

zoomControl(bool) (默认: false) 显示缩放控制器，允许用户更改它

mapTypeControl(bool) (默认: false) 显示地图类型选择控制器

scaleControl(bool) (默认: false) 显示地图比例控制器

streetViewControl(bool) (默认: false) 显示地图 StreetView 控制器

fullScreenControl(bool) (默认: false) 显示全屏控制器

rotateControl(bool) (默认: false) 显示旋转控制器

searchBoxControl(bool) (默认: false) 显示搜索框控制器以搜索位置。选择后将更新字段值

geolocationControl(bool) (默认: false) 自定义控制器以获取设备地理位置并使用它更新地图位置。它需要用户允许设备访问地理位置数据权限

coordsBoxControl(bool) (默认: false) 显示当前字段值的自定义控制器，格式为纬度，经度

选项

zoom(int) (默认: 1) 接受一个整数作为值并设置地图的初始缩放

minHeight(string) (默认: 50vh) 接受一个字符串来设置地图高度，必须是有效的 CSS min-height。例如：80vh，30%，50px

mapTypeId(string) (默认: roadmap) 接受一个字符串：roadmap,satellite,hybrid, terrain

searchBoxPlaceholderText(string) (默认: Search Address) 接受一个字符串以自定义搜索框占位符文本

locationButtonText(string) (默认: My location) 接受一个字符串以自定义位置按钮文本

fixMarkerOnCenter(bool) (默认: false) 当用户拖动地图时，标记移动到中心并更新字段值

default(array) (默认: ['lat' => 0,'lng' => 0]) 设置默认值

defaultToMyLocation(bool) (默认: false) 将默认值设置为当前位置

在您的 filament 表单模式中

        GoogleMapsMarker::make('location')
            ->default(['lat' => 40.7587,'lng' => -73.9786])
            ->zoom(15)
            ->zoomControl()
            ->minHeight('60vh')
            ->mapTypeId('satellite')
            ->mapTypeControl()
            ->scaleControl()
            ->streetViewControl()
            ->fullScreenControl()
            ->rotateControl()
            ->searchBoxControl()
            ->searchBoxPlaceholderText('Type an address')
            ->geolocationControl()
            ->locationButtonText('Go to my location')
            ->defaultToMyLocation()
            ->coordsBoxControl()
            ->fixMarkerOnCenter()

这将显示包含所有可用选项的地图

测试

composer test

变更日志

请参阅 CHANGELOG 了解最近更改的更多信息。

致谢

• Luis Escobar Bravo 的分支
• AAbosham
• 所有贡献者

许可证

麻省理工学院许可证（MIT）。有关更多信息，请参阅许可文件。