Question

您好我在使用外部链接处理coffeescript和Google地图时遇到了问题。

我尝试了很多解决方案，因为我无法弄清楚为什么信息窗口没有显示

jQuery(document).ready ($) ->

  if $('#map').length > 0
    marker = google.maps.event.addDomListener(window, 'load', initialize);
    $('#map').after('<a href="#"  id="open-marker"><span class="icon-icons_arrow-right"></span>open info window</a>');
    $('#open-marker').on 'click', ->
      google.maps.event.trigger marker, 'click'
      return

initialize = ->

  pos = undefined
  positionFound = false
  latlon = new google.maps.LatLng(50.5913444,8.7154506)
  #icon = new google.maps.MarkerImage(
  #  settings.marker_icon
  #)

  style = [{"featureType":"administrative","elementType":"all","stylers":[{"visibility":"on"},{"saturation":-100},{"lightness":20}]},{"featureType":"road","elementType":"all","stylers":[{"visibility":"on"},{"saturation":-100},{"lightness":40}]},{"featureType":"water","elementType":"all","stylers":[{"visibility":"on"},{"saturation":-10},{"lightness":30}]},{"featureType":"landscape.man_made","elementType":"all","stylers":[{"visibility":"simplified"},{"saturation":-60},{"lightness":10}]},{"featureType":"landscape.natural","elementType":"all","stylers":[{"visibility":"simplified"},{"saturation":-60},{"lightness":60}]},{"featureType":"poi","elementType":"all","stylers":[{"visibility":"off"},{"saturation":-100},{"lightness":60}]},{"featureType":"transit","elementType":"all","stylers":[{"visibility":"off"},{"saturation":-100},{"lightness":60}]}]

  mapOptions =
    zoom: 15,
    center: latlon,
    styles: style

  map = new google.maps.Map(document.getElementById('map'), mapOptions)
  contentString = "<h4>Info window</h4>"
  infowindow = new google.maps.InfoWindow(content: contentString)
  marker = new google.maps.Marker(
    position: latlon
    map: map
    title: ""
    icon: icon
  )

  google.maps.event.addListener marker, "click", ->
    infowindow.open map, marker
  return marker

浏览器显示没有错误。设置标记图标通过wordpress localize脚本添加 - ＆gt;图标显示，标记点击功能也可以。

    wp_enqueue_script( 'scripts', get_template_directory_uri() . '/js/app.js', array(), '20120206', true );

  $settings = array('marker_icon' => get_template_directory_uri().'/images/map-marker.svg');
  wp_localize_script('scripts', 'settings', $settings);

Answer 1

所以我将你的咖啡因翻译成了js并创建了jsfiddle project。你的代码似乎是正确的，infowindow工作得很好，除了变量icon = new google.maps.MarkerImage(settings.marker_icon);没有定义设置...当我注释掉图标线时，你的infowindow工作得很好。错误似乎是没有定义设置。

使用coffeescript显示信息窗口google marker外部点击

1 个答案: