occ2 / nette-mapy-cz
基于 MAPY.CZ API 的 Nette Framework 地图控件和表单地图选择器
1.1.2
2019-10-02 13:47 UTC
Requires
- php: ^7.2
- latte/latte: ^2.4|^2.5
- nette/application: ^2.4|^3.0
- nette/di: ^2.4|^3.0
- nette/forms: ^2.4|^3.0
This package is auto-updated.
Last update: 2024-09-07 03:02:13 UTC
README
使用 mapy.cz API 为 Nette Framework 提供地图坐标选择器和地图控件
安装
composer require occ2/nette-mapy-cz
安装 JS 文件
将 assets/mapycz.js 添加到您的网页目录中(www/js 等)
将 MAPY.CZ 加载器和项目 JavaScript 文件添加到您的页面标题中
<head> <script src="https://api.mapy.cz/loader.js"></script> <script>Loader.load()</script> <script src="_your_js_directory_/mapycz.js"></script> </head>
配置设置
在您的 config.neon 中注册控制工厂作为服务,添加选择器到您的表单中
# register method addGpsPicker to youe forms extensions: mapycz: MapyCZ\DI\GPSPickerExtension services: # add filter json to your latte engine nette.latteFactory: setup: - addFilter(json, MapyCZ\Helpers\Filters::json) # create map control factory service - MapyCZ\Controls\MapControl\Factories\IMapControlFactory
使用方法
在您的演示者中
use MapyCZ\Controls\MapControl\Factories\IMapControlFactory; use MapyCZ\Controls\MapControl; use Nette\Application\UI\Form; /** * @var IMapControlFactory * @inject */ public $mapControlFactory; ... /** * @return MapControl * @param string $name */ protected function createComponentMap(string $name): MapControl { $map = $this->mapControlFactory->create(); $map->settings = [ "mapId" => "map", // HTML id of map element "width" => 400, // map width in pixels "height" => 300, // map height in pixels "units" => "px", // units of map dimensiosns "mapType" => 1, // default map "center" => [ // default center of map "latitude" => 50, "longitude" => 15, ], "defaultZoom" => 13, // default zoom "controls" => true, // show controls ]; $this->addComponent($map, $name); return $map; } ... /** * @return Form * @param string $name */ protected function createComponentForm(string $name): Form { $form = new Form(); ... $form->addGpsPicker('gps', 'Vyberte polohu') ->setSettings([ "mapId" => "map", "width" => 400, "height" => 300, "mapType" => 1, "units" => "px", "center" => [ "latitude" => 50, "longitude" => 15, ], "defaultZoom" => 12, "controls" => true, ]); .. $this-addComponent($form, $name); return $form; }
GPS 选择器在服务器端验证坐标(纬度 -90 - 90,经度 -180 - 180),并返回包含纬度和经度属性的 ArrayHash
$values = $form->getValues(); $latitude = $values->gps->latitude; $longitude = $values->gps->longitude;