README

GPS坐标选择器。 现在试试！

驱动程序

• Google Maps API v3
• Mapy.cz API v4
• Nokia Maps API v2
• OpenStreetMap（使用Google Maps API v3）

许可证

New BSD

依赖关系

Nette 2.0.0

演示

http://vojtechdobes.com/gpspicker/

安装

1. 从Github获取源代码或通过Composer（vojtech-dobes/nette-forms-gpspicker）。
2. 将VojtechDobes\NetteForms\GpsPickerExtension注册为扩展。
3. 在app/templates/@layout.latte中链接适当的地图API SDK和client/nette.gpsPicker.js。

extensions:
	gpspicker: VojtechDobes\NetteForms\GpsPickerExtension

在Nette 2.0中，注册在app/bootstrap.php中完成

$configurator->onCompile[] = function ($configurator, $compiler) {
	$compiler->addExtension('gpspicker', new VojtechDobes\NetteForms\GpsPickerExtension);
};

	<script src="http://maps.googleapis.com/maps/api/js?libraries=places&sensor=false"></script>
	<script src="{$basePath}/libs/nette.gpsPicker.js"></script>
</body>

（例如，使用Google Maps API v3时）

使用方法

$form->addGpsPicker('coords', 'Coordinates:');

您可以添加一些选项（每个选项也有一些像设置器一样的东西）

$form->addGpsPicker('coords', 'Coordinates:', array(
	'type' => VojtechDobes\NetteForms\GpsPicker::TYPE_SATELLITE,
	'zoom' => 1, // something like whole planet I guess
	'size' => array(
		'x' => 411,
		'y' => 376,
	),
));

如果您喜欢手动渲染，可以省略标题

$form->addGpsPicker('coords', array(
	'type' => ...
	...
));

返回的值是具有lat和lng属性的GpsPoint实例。它继承自Nette\Object。

$lat = $form->values->coords->lat;
$lng = $form->values->coords->lng;

您可以通过这种方式设置值（或默认值）

$form['coords']->setDefaultValue(array(
	'lat' => 50.103245,
	'lng' => 14.474691,
));

验证

use VojtechDobes\NetteForms\GpsPicker as Gps;

现在您可以轻松地添加各种GPS约束

$form->addGpsPicker('coords')
	->addRule(Gps::MIN_LAT, 'Minimal latitude must be %f.', 20)
	->addRule(Gps::MIN_LNG, 'Minimal longitude must be %f.', 40)
	->addRule(Gps::MAX_LAT, 'Maximum latitude must be %f.', 20)
	->addRule(Gps::MAX_LNG, 'Maximum longitude must be %f.', 40)
	->addRule(Gps::MIN_DISTANCE_FROM, 'Minimal distance from Prague must be %d m.', array(15000, array(
		'lat' => 50.083,
		'lng' => 14.423,
	)));
	->addRule(Gps::MAX_DISTANCE_FROM, 'Maximum distance from Prague must be %d m.', array(100000, array(
		'lat' => 50.083,
		'lng' => 14.423,
	)));

前四个规则也将被客户端验证。

手动渲染

如果用户不支持JavaScript或离线，选择器提供几个手动设置坐标的输入。您也可以轻松地手动渲染它们以及整个元素。

{form formName}
	...

	{gpspicker coords}
		{gpspicker:label lat}Latitude:{/gpspicker:label} {gpspicker:input lat}
		{gpspicker:label lng}Longitude:{/gpspicker:label} {gpspicker:input lng}
	{/gpspicker}
{/form}

通过地址搜索

默认启用，GpsPicker支持通过输入地址搜索地图。将使用Google Places自动完成服务的额外<input>元素添加到地图中。

如果您想手动渲染它，请使用search键

{gpspicker coords}
	{gpspicker:label search /} {gpspicker:input search}
{/gpspicker}

您可以使用enableSearch/disableSearch方法对/取消启用搜索功能

$form->addGpsPicker('coords', 'Coordinates:')
	->disableSearch();

或在构造函数中

$form->addGpsPicker('coords', 'Coordinates:', array(
	'search' => FALSE,
));

提供商

如果您担心Google Maps的API请求速率限制，您也可以使用替代提供商。您需要做的只是链接它们相应的API SDK并设置驱动程序

$form->addGpsPicker('coords', 'Coordinates:')
	->setDriver(Gps::DRIVER_SEZNAM);

可用的提供商有

Google

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?libraries=places&sensor=false"></script>

Nokia

<script src="http://api.maps.nokia.com/2.2.1/jsl.js?with=all" charset="utf-8"></script>
<script>
	nokia.Settings.set('appId', 'XXX');
	nokia.Settings.set('authenticationToken', 'XXX');
</script>

OpenStreetMap

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>

Seznam（Mapy.cz）

<script src="http://api4.mapy.cz/loader.js"></script>
<script>Loader.load()</script>