map
HTML
<script src="//api-maps.yandex.ru/2.1/?lang=ru_RU"></script>
<script src="//code.jquery.com/jquery-2.2.0.min.js"></script>
<div id="calc">рассчитать</div>
<div id="result"></div>
<div id="map"></div>
CSS
html, body, #map {
width: 100%;
height: 100%;
padding: 0;
margin: 0;
}
#calc{padding: 5px; background: blue; margin: 5px;text-align: center;color: #fff;cursor: pointer;}
#result{display: none;background: #fff;}
#result.active{display: block;}
JavaScript
$('#calc').on('click',function(){
$('#result').addClass('active');
});
function init() {
var myMap = new ymaps.Map('map', {
center: [60.906882, 30.067233],
zoom: 9,
type: 'yandex#map',
controls: []
}),
searchStartPoint = new ymaps.control.SearchControl({
options: {
useMapBounds: true,
noPlacemark: true,
noPopup: true,
placeholderContent: 'Адрес начальной точки',
size: 'large'
}
}),
searchFinishPoint = new ymaps.control.SearchControl({
options: {
useMapBounds: true,
noCentering: true,
noPopup: true,
noPlacemark: true,
placeholderContent: 'Адрес конечной точки',
size: 'large',
float: 'none',
position: { left: 10, top: 44 }
}
}),
calculator = new DeliveryCalculator(myMap, myMap.getCenter());
myMap.controls.add(searchStartPoint);
myMap.controls.add(searchFinishPoint);
searchStartPoint.events.add('resultselect', function (e) {
var results = searchStartPoint.getResultsArray(),
selected = e.get('index'),
point = results[selected].geometry.getCoordinates();
calculator.setStartPoint(point);
})
.add('load', function (event) {
// По полю skip определяем, что это не дозагрузка данных.
// По getRusultsCount определяем, что есть хотя бы 1 результат.
if (!event.get('skip') && searchStartPoint.getResultsCount()) {
searchStartPoint.showResult(0);
}
});
searchFinishPoint.events.add('resultselect', function (e) {
var results = searchFinishPoint.getResultsArray(),
selected = e.get('index'),
point = results[selected].geometry.getCoordinates();
...