README

NovaMapCard

使用Laravel Nova和Vue2Leaflet自定义地图卡片。支持Google Maps、标记聚类、高度、缩放、经纬度坐标、GeoJSON、标记弹窗和自定义标记图标。

寻找Laravel Nova地图字段？ (https://github.com/iMuMz/NovaLeafletMap)

安装

composer require imumz/nova-map-card

使用方法

use Imumz\NovaMapCard\NovaMapCard
...
(new NovaMapCard())->width("1/2")

可用方法

缩放

(new NovaMapCard())
->zoom(4)

高度

(new NovaMapCard())
->height('400px') // default is 300px

Google Maps

默认提供者是OpenStreetMaps。
您必须设置Google Maps API密钥 (https://developers.google.com/maps/documentation/javascript/get-api-key).

(new NovaMapCard())
->googleApiKey('')
->googleMapType('roadmap'), // roadmap, satellite or hybrid

纬度 / 经度（点）

地图将自动居中到提供的坐标。

(new NovaMapCard())
->type('LatLon')
->point('-6.081689','145.391881')

GeoJSON

您必须手动设置GeoJson中心。

(new NovaMapCard())
->type('GeoJson')
->geoJson('')
->center('-6.081689','145.391881')

GeoJson 示例

{
  "type": "FeatureCollection",
  "features": [
    {
      "type": "Feature",
      "properties": {
        "popup": "I am a Popup"
      },
      "geometry": {
        "type": "Point",
        "coordinates": [
          23.8623046875,
          -30.221101852485987
        ]
      }
    }
  ]
}

弹窗

(new NovaMapCard())
->popupName('popup')

自定义标记图标

(new NovaMapCard())
->mapIconUrl('/images/marker-icon.png')

您现在可以传递额外的参数来设置图标大小和锚点

->mapIconUrl('/images/marker-icon.png',[100,100],[50,50])

imumz / nova-map-card

维护者

详细信息