Клуб API Карт

Uncaught TypeError: Cannot read property 'setCenter' of undefined

himerafrontier
4 июня 2015, 11:43

Добрый день, пытался соединить несколько примеров в один, но появляется ошибка "Uncaught TypeError: Cannot read property 'setCenter' of undefined". Чем она может быть вызвана?

 

Код примера, где ошибка есть:

 

button.html
<!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])
}

 

Код, где та же функция не вызывает ошибку

 

mapparams.html
<!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
        });
}
2 комментария
Подписаться на комментарии к посту

В функции setCenter () вы обращаетесь к переменной myMap которая не ссылается на карту, всё из-за http://habrahabr.ru/post/78991/

Спасибо, теперь все работает.