Добрый день, пытался соединить несколько примеров в один, но появляется ошибка "Uncaught TypeError: Cannot read property 'setCenter' of undefined". Чем она может быть вызвана?
Код примера, где ошибка есть:
<!DOCTYPE html>
<html>
<head>
<title>Примеры. Добавление кнопки на карту</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<!-- Если вы используете API локально, то в URL ресурса необходимо указывать протокол в стандартном виде (http://...)-->
<script src="https://api-maps.yandex.ru/2.1/?lang=ru_RU" type="text/javascript"></script>
<script src="button.js" type="text/javascript"></script>
<style>
html, body, #map {
width: 600px;
height: 500px;
padding: 0;
margin: 0;
}
</style>
</head>
<body>
<div id="map"></div>
<div id="buttons">
<input type="button" value="Изменить центр" onclick="setCenter();" />
</div>
</body>
</html>
button.js
ymaps.ready(init);
var myMap;
function init () {
var myMap = new ymaps.Map('map', {
center: [48.0345, 38.4820],
zoom: 14,
controls: []
}),
firstButton = new ymaps.control.Button("Кнопка");
myMap.controls.add(firstButton, {float: 'right'});
var secondButton = new ymaps.control.Button({
data: {
// Зададим текст и иконку для кнопки.
content: "Адаптивная кнопка",
// Иконка имеет размер 16х16 пикселей.
image: 'images/error.png'
},
options: {
// Поскольку кнопка будет менять вид в зависимости от размера карты,
// зададим ей три разных значения maxWidth в массиве.
maxWidth: [28, 150, 178]
}
});
myMap.controls.add(secondButton);
// Будем искусственно переключать размеры кнопки каждую секунду, чтобы показать все варианты
// внешнего вида кнопки.
// При изменении размера карты эти перестроения будут происходить автоматически.
function changeSize () {
var oldSize = secondButton.options.get('size'),
newSize;
switch (oldSize) {
case 'small': newSize = 'medium'; break;
case 'medium': newSize = 'large'; break;
case 'large': newSize = 'small'; break;
default: newSize = 'small';
}
secondButton.options.set('size', newSize);
}
window.setInterval(changeSize, 1000);
}
function setCenter () {
myMap.setCenter([48.0345, 38.4820])
}
Код, где та же функция не вызывает ошибку
<!DOCTYPE html>
<html>
<head>
<title>Примеры. Задание и изменение параметров карты.</title>
<meta http-equiv="Content-Type"
content="text/html; charset=windows-1251"/>
<!-- Если вы используете API локально, то в URL ресурса необходимо указывать протокол в стандартном виде (http://...)-->
<script src="http://api-maps.yandex.ru/2.1/?lang=ru_RU" type="text/javascript"></script>
<script src="mapparams.js" type="text/javascript"></script>
<style>
html, body, #map {
width: 600px;
height: 500px;
padding: 0;
margin: 0;
}
</style>
</head>
<body>
<div id="map"></div>
<div id="buttons">
<input type="button" value="Изменить центр" onclick="setCenter();" />
<input type="button" value="Изменить границы" onclick="setBounds();" />
<input type="button" value="Изменить тип и плавно переместиться" onclick="setTypeAndPan();" />
</div>
</body>
</html>
mapparams.js
ymaps.ready(init);
var myMap;
function init () {
// Параметры карты можно задать в конструкторе.
myMap = new ymaps.Map(
// ID DOM-элемента, в который будет добавлена карта.
'map',
// Параметры карты.
{
// Географические координаты центра отображаемой карты.
center: [55.76, 37.64],
// Масштаб.
zoom: 14,
controls: []
}
);
}
function setCenter () {
myMap.setCenter([48.0345, 38.4820])
}
function setBounds () {
// Bounds - границы видимой области карты.
// Задаются в географических координатах самой юго-восточной и самой северо-западной точек видимой области.
myMap.setBounds([[37, 38], [39, 40]]);
}
function setTypeAndPan () {
// Меняем тип карты на "Народный гибрид".
myMap.setType('yandex#publicMapHybrid');
// Плавное перемещение центра карты в точку с новыми координатами.
myMap.panTo([62.915, 34.461], {
// Задержка между перемещениями.
delay: 1500
});
}