hector68 / yii2-map-input-widget

Yii2地图输入小部件的分支。允许您通过人性化的界面选择地理坐标。

安装数: 1,645

依赖者: 1

建议者: 0

安全: 0

星标: 1

关注者: 2

分支: 24

语言:JavaScript

类型:yii2-extension

v2.0.2 2016-03-02 07:18 UTC

This package is not auto-updated.

Last update: 2024-09-11 23:13:43 UTC


README

描述

这是一个Yii2输入小部件,提供通过Google地图选择地理坐标的用户友好界面。允许用户通过点击嵌入网页中的交互式Google地图来选择地理坐标。还允许用户输入地点名称,通过Google Places API搜索它。

该小部件支持composer。您可以从packagist仓库获取最新版本。

演示

简单的部件演示在此可用。您可以通过一些网络开发者工具(例如Firebug)检查隐藏的输入值,以查看地理坐标在部件中的表示。

使用示例

最小示例

所有小部件参数都是可选的,有合理的默认值,可能不需要配置。

echo $form->field($model, 'coordinates')->widget('kolyunya\yii2\widgets\MapInputWidget');

扩展示例

以下示例中描述了可用于配置的小部件参数的详尽列表(这些参数不是从yii\widgets\InputWidget派生的)。

echo $form->field($model, 'coordinates')->widget(
    'kolyunya\yii2\widgets\MapInputWidget',
    [

        // Google maps browser key.
        'key' => $key,

        // Initial map center latitude. Used only when the input has no value.
        // Otherwise the input value latitude will be used as map center.
        // Defaults to 0.
        'latitude' => 42,

        // Initial map center longitude. Used only when the input has no value.
        // Otherwise the input value longitude will be used as map center.
        // Defaults to 0.
        'longitude' => 42,

        // Initial map zoom.
        // Defaults to 0.
        'zoom' => 12,

        // Map container width.
        // Defaults to '100%'.
        'width' => '420px',

        // Map container height.
        // Defaults to '300px'.
        'height' => '420px',

        // Coordinates representation pattern. Will be use to construct a value of an actual input.
        // Will also be used to parse an input value to show the initial input value on the map.
        // You can use two macro-variables: '%latitude%' and '%longitude%'.
        // Defaults to '(%latitude%,%longitude%)'.
        'pattern' => '[%longitude%-%latitude%]',

        // Google map type. See official Google maps reference for details.
        // Defaults to 'roadmap'
        'mapType' => 'satellite',

        // Marker animation behavior defines if a marker should be animated on position change.
        // Defaults to false.
        'animateMarker' => true,

        // Map alignment behavior defines if a map should be centered when a marker is repositioned.
        // Defaults to true.
        'alignMapCenter' => false,

        // A flag which defines if a search bar should be rendered over the map.
        'enableSearchBar' => true,

    ]
);