Google Map + JS (добавить круг)

-1

Я хочу нарисовать круг на картах Google, используя JS.Google Map + JS (добавить круг)

Мой код:

Код кнопки:

index.html

<button type="button" class="btn btn-primary btn-sm" id="test1" onclick="DrawCircle()">Wyświetlk mapę

Div для отображения (index.html):

<div id="googleMap" style="width:500px;height:380px;"> 
    <script>mapping()</script> 
</div>

Функция для отображения дро и один круг образцов (функции.js)

function mapping(){ 

    var citymap = 
    { 
      warsaw: 
      { 
      center: {lat: 52.14, lng: 21.1}, 
      population: 1740000 
      } 
    } 


    function initialize() { 
     var mapProp = { 
     center:new google.maps.LatLng(52.13 ,19.02), 
     zoom:6, 
     mapTypeId:google.maps.MapTypeId.ROADMAP 
     }; 


    var map = new google.maps.Map(document.getElementById("googleMap"), mapProp); 

    for (var city in citymap) 
    { 

     var cityCircle = new google.maps.Circle({ 
      strokeColor: '#FF0000', 
      strokeOpacity: 0.8, 
      strokeWeight: 2, 
      fillColor: '#FF0000', 
      fillOpacity: 0.35, 
      map: map, 
      center: citymap[city].center, 
      radius: Math.sqrt(citymap[city].population) * 30 
    }); 
    } 

    } 

    google.maps.event.addDomListener(window, 'load', initialize); 
}

И работать, чтобы сделать круг:

function DrawCircle() 
    { 

     draw_circle = new.google.maps.Circle({ 

      center: {lat: 52.94, lng: 20.1}, 
      radius: 2000, 
      strokeColor: "#000", 
      strokeOpacity: 0.6, 
      strokeWeight: 2; 
      fillColor: "#0099AA", 
      fillOpacity: 0.25, 
      map: map 
     }); 

    }

У меня есть ошибка: Uncaught SyntaxError: Неожиданный идентификатор (индекс): 198 Uncaught ReferenceError: отображение не определено

Какие изменения/добавления (repiar)? Я не могу найти решение этой проблемы здесь и в документации google api.

Я буду рад помочь

источник

2016-04-27 Tomasz Jeznach

У вас есть два опечатка в вашем коде: 1. 'new.google.maps.Circle ({' (должно быть пробелом между новым и google) 2. 'strokeWeight: 2;' (должно быть запятой). [ рабочий скрипт] (http://jsfiddle.net/geocodezip/zcuo7o5w/2/) – geocodezip

Вы звоните mapping(), вероятно, прежде чем он будет определен.

Где находится ваш код JavaScript на вашей HTML-странице?

Удостоверьтесь, что блок JavaScript, который вы разместили, находится в вашем HTML до вашего звонка до mapping().

Однако я бы предположил, что mapping() как функция не очень полезна, так как вы уже используете слушателя load, который вызывает initialize.

Так что я бы предложил удалить этот <script>mapping()</script> вообще, а также удалить function mapping() { ... } вокруг вашего кода, и он должен работать автоматически, вне зависимости от того, где вы поместите код. Просто не забудьте позвонить DrawCircle только после запуска кода инициализации. Например, вы можете поместить его в функцию initialize.

(И, кстати, я не уверен, что если линия draw_circle = ... делает то, что вы хотите. Я предполагаю, что вы по крайней мере, нужно var прежде, чем это, чтобы предотвратить случайное создание глобальной переменной.)

Также я будет предлагать отступы вашего кода правильно, очень неясно, где разные области действия.

EDIT: Я заметил еще одну проблему: new.google.maps.circle Недействительный код (new - это ключевое слово). Думаю, вы хотите new google.maps.circle без первой точки? Если эта синтаксическая ошибка приведет к тому, что весь ваш внешний файл JavaScript не будет загружен (особенно если у вас есть, как вы объяснили в комментариях, включили его в область <head>), это также объясняет, почему mapping не может быть найден.

Вы должны исправить эту ошибку, и вы также должны убедиться, что открытая консоль разработчика открыта (нажмите F12 в вашем браузере) во время загрузки страницы и просмотрите вкладку консоли там, так как вы увидели бы сообщение об ошибке синтаксиса там (возможно, со ссылкой на то, где именно в файле произошла ошибка).

источник

2016-04-27 09:57:05 CherryDT

Если я удалю сопоставление скриптов(), карта не будет отображаться (код javascript находится в другом файле) –

1) Вы также, как я предположил, удалить оболочку 'function mapping() {...}' вокруг основного кода? 2) Да, но где находится другой файл? – CherryDT

У меня есть index.html, где есть только div и в главном URL-адресе function.js. В функции JS у меня есть этот скрипт. –

Google Map + JS (добавить круг)

ответ

Смежные вопросы