README

#Yii2 地图输入小部件

##描述 一个 Yii2 输入小部件，通过 Google 地图 提供用户友好的界面来选择地理坐标。允许用户通过点击嵌入到网页中的交互式 Google 地图来选择地理坐标。

该小部件是 composer-启用的。您可以从 packagist 仓库 获取最新版本。

##演示 一个简单的示例小部件在此 处 可用。您可以通过一些网络开发者工具（例如 Firebug）检查隐藏的输入值，以了解地理坐标如何在小部件中表示。

##使用示例

###最小示例 为了重现以下最小示例，您需要获取 Google 地图浏览器密钥，如 Google 地图开发者指南 中所述。密钥可以存储为应用程序参数以方便引用或存放在任何地方。所有其他小部件参数都有一些合理的默认值，可能不需要配置。

echo $form->field($model, 'coordinates')->widget(
    'kolyunya\yii2\widgets\MapInputWidget',
    [
        // Google maps browser key.
        'key' => $key,
    ]
);

###扩展示例 下面的示例描述了可用于配置的小部件参数的详尽列表（这些参数不是从 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,

        // jQuery selector for an input where your are going to store your
        // latitude value
        latitudeSelector = null,

        // jQuery selector for an input where your are going to store your
        // longitude value
        longitudeSelector = null,

        // jQuery selector for an input where your are going to save geocoding
        // result value
        addressSelector = null,

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

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

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

        // 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,

    ]
);