Вопросы Теги

Как я могу встроить интерактивную панель в маркер Google Map?

Оператор == проверяет, указывают ли две ссылки на один и тот же объект или нет. .equals() проверьте фактическое содержимое строки (значение).

Обратите внимание, что метод .equals() принадлежит классу Object (суперкласс всех классов). Вам необходимо переопределить его в соответствии с вашим требованием к классу, но для String оно уже реализовано и проверяет, имеет ли две строки одно и то же значение.

  • Случай 1 
    String s1 = "Stack Overflow";
String s2 = "Stack Overflow";
s1 == s2;      //true
s1.equals(s2); //true
    Причина: строка литералы, созданные без нуля, хранятся в пуле строк в области перментонов кучи. Таким образом, оба s1 и s2 указывают на один и тот же объект в пуле.
  • Случай 2 
    String s1 = new String("Stack Overflow");
String s2 = new String("Stack Overflow");
s1 == s2;      //false
s1.equals(s2); //true
    Причина. Если вы создаете объект String с использованием ключевого слова new, ему выделяется отдельное пространство в куче.
-2
задан geocodezip 10 March 2019 в 17:28
поделиться

2 ответа

Вы можете отобразить панель встраивания, вставив элемент в информационное окно, а затем запустив связанный javascript в прослушивателе событий «domready» в информационном окне. 

var props = {
  content: "https://public.tableau.com/en-us/s/gallery/moose-crashes-maine?gallery=votd",
  id: "viz1552237426081"
};
if (props.id) {
  var infoWindow = new google.maps.InfoWindow({
    content: document.getElementById(props.id)
  });

  marker.addListener('click', function() {
    infoWindow.open(map, marker);
    google.maps.event.addListener(infoWindow, 'domready', function() {
      var divElement = document.getElementById('viz1552237426081');
      var vizElement = divElement.getElementsByTagName('object')[0];
      vizElement.style.width = '1100px';
      vizElement.style.height = '877px';
      var scriptElement = document.createElement('script');
      scriptElement.src = 'https://public.tableau.com/javascripts/api/viz_v1.js';
      vizElement.parentNode.insertBefore(scriptElement, vizElement);
    });
  });
}

доказательство концепции скрипта

screenshot of resulting map

фрагмент кода: [ 1112] 

var props = {
  content: "https://public.tableau.com/en-us/s/gallery/moose-crashes-maine?gallery=votd",
  id: "viz1552237426081"
};

function initMap() {
  var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 8,
    center: {
      lat: 45.253783,
      lng: -69.4454689
    }
  });
  // Maine, USA (45.253783, -69.44546889999998)
  var marker = new google.maps.Marker({
    position: {
      lat: 45.253783,
      lng: -69.4454689
    },
    map: map
  });
  if (props.id) {
    var infoWindow = new google.maps.InfoWindow({
      content: document.getElementById(props.id)
    });

    marker.addListener('click', function() {
      infoWindow.open(map, marker);
      google.maps.event.addListener(infoWindow, 'domready', function() {
        var divElement = document.getElementById('viz1552237426081');
        var vizElement = divElement.getElementsByTagName('object')[0];
        vizElement.style.width = '1100px';
        vizElement.style.height = '877px';
        var scriptElement = document.createElement('script');
        scriptElement.src = 'https://public.tableau.com/javascripts/api/viz_v1.js';
        vizElement.parentNode.insertBefore(scriptElement, vizElement);
      });
    });
  }
  map.setCenter(marker.getPosition());
}
html,
body,
#map {
  height: 100%;
  margin: 0;
  padding: 0;
}

.tableauPlaceholder {
  display: none;
}
<div id="map"></div>
<!-- Replace the value of the key parameter with your own API key. -->
<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk&callback=initMap"></script>
<div class='tableauPlaceholder' id='viz1552237426081' style='position: relative'><noscript>
  <a href='#'>
    <img alt=' ' src='https:&#47;&#47;public.tableau.com&#47;static&#47;images&#47;Mo&#47;MooseCrashesinMaine&#47;MooseCrashes2010-2017Version3&#47;1_rss.png' style='border: none; height:877px; width:1100px;' />
    </a>
</noscript>
  <object class='tableauViz' style='display:none;'>
  <param name='host_url' value='https%3A%2F%2Fpublic.tableau.com%2F' />
  <param name='embed_code_version' value='3' /> <param name='site_root' value='' />
  <param name='name' value='MooseCrashesinMaine&#47;MooseCrashes2010-2017Version3' />
  <param name='tabs' value='no' /><param name='toolbar' value='yes' />
  <param name='static_image' value='https:&#47;&#47;public.tableau.com&#47;static&#47;images&#47;Mo&#47;MooseCrashesinMaine&#47;MooseCrashes2010-2017Version3&#47;1.png' />
  <param name='animate_transition' value='yes' />
  <param name='display_static_image' value='yes' />
  <param name='display_spinner' value='yes' />
  <param name='display_overlay' value='yes' />
  <param name='display_count' value='yes' />
</object>
</div>
<script type='text/javascript'>
</script>

0
ответ дан geocodezip 10 March 2019 в 17:28
поделиться

Просто добавьте ссылку на содержимое информационного окна и в общем добавьте HTML-код, который вы предпочитаете для управления содержимым информационного окна 

if(props.content){
 var infoWindow = new google.maps.InfoWindow({
  content:props.content +
  '<a href="https://public.tableau.com/en-us/s/gallery/moose-crashes-maine?gallery=votd"'>my_link</a>'
 });

 marker.addListener('click',function(){
    infoWindow.open(map, marker);
 });
0
ответ дан scaisEdge 10 March 2019 в 17:28
поделиться
Другие вопросы по тегам:

Похожие вопросы: