All4DK
/
wikipoints
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Первый вариант маршрутов

This commit is contained in:
Krivchikov Dmitry 2014-04-25 08:49:58 +04:00
parent 5f1e140223
commit b3a288465a
3 changed files with 77 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ground/controllers/IndexController.php
View File

@ -9,7 +9,7 @@ class IndexController extends Controller
static function actionIndex()
{
self::addScript('/js/jquery-2.1.0.min.js');
self::addScript('http://api-maps.yandex.ru/2.0-stable/?load=package.standard&lang=ru-RU&mode=release');
self::addScript('http://api-maps.yandex.ru/2.0-stable/?load=package.full&lang=ru-RU&mode=release');
self::addScript('/js/main.js?ver='.App::getConfig('version'));
self::addScript('/js/bootstrap.min.js');
self::addStyle('/css/style.css?ver='.App::getConfig('version'));

9
ground/views/indexTemplate.php
View File

@ -1,4 +1,11 @@
<div id="map"></div>
<div id="routeWindow" class="popover fade in" style="display: none; position: absolute; top: 50px; right: 7px; left: auto;">
<h3 class="popover-title">Мой маршрут</h3>
<div class="popover-content">
<ul id="wayPoints"></ul>
<button class="btn btn-default" onclick="buildRoute()"><span class="glyphicon glyphicon-send"></span> Проложить</button>
</div>
</div>
<div id="footer">
<table width="100%">
<tr>
@ -14,7 +21,7 @@
&nbsp;
</td>
<td>
<!-- <button class="btn btn-default" type="button"><span class="glyphicon glyphicon-align-justify"></span> Маршрут</button>-->
<button class="btn btn-default" type="button" onclick="$('#routeWindow').toggle(200)"><span class="glyphicon glyphicon-align-justify"></span> Маршрут</button>
<button class="btn btn-default" type="button" onclick="showMeOnTheMap()"><span class="glyphicon glyphicon-screenshot"></span> Я на карте</button>
</td>
<td class="text-right">

104
public/js/main.js
View File

@ -53,29 +53,36 @@ function init() {
myMap.geoObjects.add(im);
}
function constructPoint(data)
{
id = data['id'];
points[id] = new ymaps.Placemark(
[data['lat'], data['lng']], {
hintContent: data['name'],
id: id
},
{
iconImageHref: data['categoryIcon'],
iconImageSize: [32, 37],
iconImageOffset: [-16, -33],
openEmptyBalloon: true,
balloonCloseButton: true
});
points[id].events.add('click', function (e) {
showInfo(e.get('target').properties.get('id'));
});
return points[id];
}
function getPoints()
{
$.ajax({
url: "/json/points/",
success: function(data){
for(var k in data) {
id = data[k]['id'];
points[id] = new ymaps.Placemark(
[data[k]['lat'], data[k]['lng']], {
hintContent: data[k]['name'],
id: id
},{
iconImageHref: data[k]['categoryIcon'],
iconImageSize: [32, 37],
iconImageOffset: [-16, -33],
openEmptyBalloon: true,
balloonCloseButton: true
});
points[id].events.add('click', function (e) {
showInfo(e.get('target').properties.get('id'));
});
myMap.geoObjects.add(points[id]);
myMap.geoObjects.add(constructPoint(data[k]));
}
}
});
@ -94,6 +101,9 @@ function showInfo(id)
description = '<div class="infoCard">' +
'<h3>' + data.name + '</h3>' +
'<img src="' + data.img + '" />' +
'<button type="button" class="btn btn-default btn-xs" onclick="addToRoute(' + id + ')">' +
'<span class="glyphicon glyphicon-plus"></span> Добавить в маршрут' +
'</button><br/>' +
data.description +
' <a href="' + data.source + '" target="blank">Подробнее...</a></div>'
points[id].properties.set('balloonContent', description);
@ -161,30 +171,20 @@ function addPoint()
lng: $('#addPointLng').val()
},
success: function(data) {
id = data;
points[id] = new ymaps.Placemark(
[$('#addPointLat').val(), $('#addPointLng').val()], {
hintContent: $('#addPointName').val(),
id: id
}, {
iconImageHref: categories[$('#addPointCategoryId').val()].icon,
iconImageSize: [32, 37],
iconImageOffset: [-16, -33],
openEmptyBalloon: true,
balloonCloseButton: false
});
points[id].events.add('click', function(e) {
showInfo(e.get('target').properties.get('id'));
});
var balloon = myMap.balloon.open([$('#addPointLat').val(), $('#addPointLng').val()], {content: 'Точка успешно добавлена!'}, {closeButton: false});
balloon = myMap.balloon.open([$('#addPointLat').val(), $('#addPointLng').val()], {content: 'Точка успешно добавлена!'}, {closeButton: false});
setTimeout(function() {
balloon.close();
}, 3000);
obj = {};
obj.id = data;
obj.name = $('#addPointName').val();
obj.lat = $('#addPointLat').val();
obj.lng = $('#addPointLng').val();
obj.categoryIcon = categories[$('#addPointCategoryId').val()].icon;
setTimeout(function(){
myMap.geoObjects.add(points[id]);
myMap.geoObjects.add(constructPoint(obj));
}, 3000);
$('#addPointModal').modal('hide');
@ -219,3 +219,35 @@ function addPoint()
}
});
}
function buildRoute()
{
wayPoints = Array();
$('#wayPoints li').each(function(i, el)
{
wayPoints.push(points[$(el).attr('pointId')].geometry.getCoordinates());
});
ymaps.route(wayPoints, {
mapStateAutoApply: true
}).then(function(route) {
// console.log(route.getPaths());
route.options.set({
// в балуне выводим только информацию о времени движения с учетом пробок
balloonContenBodyLayout: ymaps.templateLayoutFactory.createClass('$[properties.humanJamsTime]'),
strokeColor: '9000ffff',
opacity: 0.9
});
myMap.geoObjects.add(route);
});
}
function addToRoute(id)
{
$('#wayPoints').append('<li pointid="'+id+'">' + points[id].properties.get('hintContent') + '</li>');
myMap.balloon.close();
$('#routeWindow').show(200);
return true;
}