Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/bscheshirwork/yii2-ymaps-widget
Widget for render canvas within yandex maps
https://github.com/bscheshirwork/yii2-ymaps-widget
widget yii2 ymaps
Last synced: 3 days ago
JSON representation
Widget for render canvas within yandex maps
- Host: GitHub
- URL: https://github.com/bscheshirwork/yii2-ymaps-widget
- Owner: bscheshirwork
- License: bsd-3-clause
- Created: 2018-11-22T13:07:50.000Z (almost 6 years ago)
- Default Branch: master
- Last Pushed: 2019-09-17T09:02:16.000Z (about 5 years ago)
- Last Synced: 2024-10-08T09:53:12.540Z (about 1 month ago)
- Topics: widget, yii2, ymaps
- Language: PHP
- Size: 12.7 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Yandex map widget for yii2
This is widget for representation yandex maps from yii2 widget.
## Installation
Add
```
"bscheshirwork/yii2-ymaps-widget": "*@dev",
```
into `require` section of you `composer.json` file.## Configure (optional)
You can change default values of `Connector` for customize
[connection to yandex map API](https://tech.yandex.ru/maps/doc/jsapi/2.1/dg/concepts/load-docpage/)First: add into config of application the `ymaps` components:
```php
[
'ymaps' => [
'class' => \bscheshirwork\ymaps\Connection::class,
'apiUri' => 'https://enterprise.api-maps.yandex.ru',
'apiParams' => ['apikey' => ''],
],
],
];
```Second: use this component in widget `connection` param
```php
= \bscheshirwork\ymaps\YMaps::widget([
'connection' => Yii::$app->ymaps,
'mapState' => [
'center' => [55.7372, 37.6066],
'zoom' => 9,
],
]); ?>
```## Usage
### Simple
Inject canvas for map.In view:
Inject code for generate map (optional, default).```php
= \bscheshirwork\ymaps\YMaps::widget([
'htmlOptions' => [
'style' => 'height: 400px;',
],
'mapState' => '{
center: [55.9238145091058, 37.897131347654376],
zoom: 10
}',
'mapOptions' => <<
```The
will be generated;
The yandex maps will be initialized and assign to this canvas.Tips: `mapState` and `mapOptions` can accept `json` string or php `array`
### Advanced usage
Advanced: Inject js vars for external js file.
In view:
```php
= $form->field($model, 'latitude')->textInput(['maxlength' => true]) ?>= $form->field($model, 'longitude')->textInput(['maxlength' => true]) ?>
= \bscheshirwork\ymaps\YMaps::widget([
'htmlOptions' => [
'style' => 'height: 400px;',
],
'mapState' => [
'center' => [$model->latitude ?: 55.7372, $model->longitude ?: 37.6066],
'zoom' => 9,
],
'simpleMap' => false,
'jsVars' => true,
]); ?>
```The
will be generated. The JS builders will be generated and inserting into `POS_HEAD` positionIn js:
```js
ymaps.ready(init);function init() {
var myPlacemark,
myMap = mapBuilder(mapId(), mapState(), mapOptions());
myMap.events.add('click', function (e) {
var coords = e.get('coords');
myPlacemark = new ymaps.Placemark(coords, {
iconCaption: 'caption'
}, {
preset: 'islands#violetDotIconWithCaption',
draggable: true
});
myMap.geoObjects.add(myPlacemark);
});
// ...
}
```#### Select a controls
```php
= \bscheshirwork\ymaps\YMaps::widget([
'htmlOptions' => [
'style' => 'height: 400px;',
],
'mapState' => [
'center' => [
$model->latitude ?? false ?: Yii::$app->params['map']['default']['latitude'],
$model->longitude ?? false ?: Yii::$app->params['map']['default']['longitude'],
],
'zoom' => $model->zoom ?? false ?: Yii::$app->params['map']['default']['zoom'],
'controls' => [
'zoomControl', 'searchControl', 'typeSelector', 'fullscreenControl', 'routeButtonControl',
/*
new \yii\web\JsExpression('new ymaps.control.ZoomControl({options: {size: "small"}})'),
new \yii\web\JsExpression('new ymaps.control.SearchControl({options: {size: "small"}})'),
new \yii\web\JsExpression('new ymaps.control.TrafficControl({options: {size: "small"}})'),
new \yii\web\JsExpression('new ymaps.control.GeolocationControl({options: {size: "small"}})'),
new \yii\web\JsExpression('new ymaps.control.FullscreenControl({options: {size: "small"}})'),
new \yii\web\JsExpression('new ymaps.control.RouteEditor({options: {size: "small"}})'),
*/
],
],
'mapOptions' => [
],
'simpleMap' => false,
'jsVars' => true,
]); ?>
```All rights reserved.
2018 © [email protected]