将Google Maps InfoBox用于存储在数组中的点 [英] Using Google Maps InfoBox for Points Stored in an Array

查看:93
本文介绍了将Google Maps InfoBox用于存储在数组中的点的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我已经在一个相当简单的应用程序中成功使用了InfoBox,但是我正在努力使它在稍微复杂一些的东西上工作.当然,我缺少一些简单的东西.

I have used InfoBox successfully in a fairly simple application but I am struggling to make it work on something just slightly more complex. For sure I am missing something simple.

目的是显示包含酒店和最近的机场的地图.然后,信息框会显示酒店的名称(非常简单:没问题)和服务机场的航班列表(有问题!).酒店详细信息作为参数传递到URL中.机场详细信息是存储在脚本中的一个数组.

The aim is to show a map with a hotel and the nearest airport(s). Then the InfoBox shows the name of the hotel (very simple: no problem) and a list of flights that serve the airport (the problem!). The hotel details are passed as parameters in the URL. The airport details are an array stored in the script.

我遇到的问题是,当我单击机场图标时,地图跳至机场阵列中的最后一个机场,并显示该最后一个机场的信息框内容.

The problem I have is that when I click the airport icon, the map jumps to the last airport in the airport array and displays the InfoBox contents for that last airport.

您可以在代码是:

<?php 
$hotel = $_GET['hotel'];
?>

<!DOCTYPE html>
<html>
<head> 
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
    <title>Little Hotels - Google Map</title>
<meta name="description" content="Little Hotels provides maps showing the location of hotels, using Google Maps to create both a street/road map and a satellite image.">
<meta name="keywords" content="Little Hotels, Little Hotels of Spain, Spain, Little Hotels of Morocco, Morocco, Little Hotels of France, France, mainland spain, balearic, balearics, canary, canaries, small, hotel, hotels, map, google map, holiday, holidays">
<style type="text/css">
html { height: 100% }
body{ height: 100%; margin: 0; padding: 0; font-family: Arial, Helvetica, sans-serif; font-size:12px; color:#333333;}
a:link, a:visited, a:hover {color: #FF6600; text-decoration: none; font-weight: bold;}
h1{font-size: 16px; color: #2B8CB9; font-weight: bold;}
#content{padding: 0 5px 0; width: 640px;}
#map_canvas { height: 100%; font-family:Helvetica, Arial, sans-serif; font-size:12px; font-weight:bold; color:#4d6eb0;}
</style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
<script type="text/javascript" src="../js/infobox.js"></script>
<script type="text/javascript" src="../js/downloadxml.js"></script>
<script type="text/javascript"> 
//<![CDATA[
     // global "map" variable
      var map = null;

  var hotelimage = new google.maps.MarkerImage('../images/hotel_icon.gif',
      new google.maps.Size(32, 37),
      new google.maps.Point(0,0),
      new google.maps.Point(16, 35));
  var shadow = new google.maps.MarkerImage('../images/hotel_shadow.png',
      new google.maps.Size(51, 37),
      new google.maps.Point(0,0),
      new google.maps.Point(16, 35));

// A function to create the markers and set up the event window function 
function createMarker(latlng, hotel) {
    var contentString = hotel;
    var marker = new google.maps.Marker({
        map: map,
        position: latlng,
        icon: image,
        zIndex: Math.round(latlng.lat()*-100000)<<5
        });

    google.maps.event.addListener(marker, 'click', function() {
        var ib = new InfoBox(ibOptions);
        boxText.innerHTML = contentString;
        ib.open(map, marker);
        });
}

// This function picks up the click and opens the corresponding info window
function myclick(i) {
  google.maps.event.trigger(gmarkers[i], "click");
}

// InfoBox
 var boxText = document.createElement("div");
        boxText.style.cssText = "border: 1px solid #4d6eb0; margin-top: 8px; background: white; padding: 5px;";

        var ibOptions = {
                 content: boxText
                ,disableAutoPan: false
                ,maxWidth: 0
                ,pixelOffset: new google.maps.Size(10, -50)
                ,zIndex: null
                ,boxStyle: { 
                  width: "160px"
                 }
                ,closeBoxMargin: "10px 2px 2px 2px"
                ,closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif"
                ,infoBoxClearance: new google.maps.Size(1, 1)
                ,isHidden: false
                ,pane: "floatPane"
                ,enableEventPropagation: false
        };
////////////////////////7

function initialize() {
      var lat = 0;
      var lng = 0;
      var zoom = 0;
      var hotelname = 0;
      var query = location.search.substring(1);
      var pairs = query.split("&");
      for (var i=0; i<pairs.length; i++) {
    var pos = pairs[i].indexOf("=");
    var argname = pairs[i].substring(0,pos).toLowerCase();
    var value = pairs[i].substring(pos+1);
        if (argname == "lat") {lat = parseFloat(value);}
        if (argname == "lng") {lng = parseFloat(value);}
        if (argname == "zoom") {zoom = parseInt(value);}
        if (argname == "hotel") {hotelname = unescape(value);}
      }
    var thisLatlng = new google.maps.LatLng(lat, lng);
  var myOptions = {
center: thisLatlng,
zoom: zoom,
mapTypeId: google.maps.MapTypeId.ROADMAP,
   streetViewControl: false,
   zoomControl: true,
   zoomControlOptions: {
    style: google.maps.ZoomControlStyle.SMALL
   }
   }

   var map = new google.maps.Map(document.getElementById("map_canvas"),
        myOptions);

  setMarkers(map, airports);


//////////////////////
  var hotelmarker = new google.maps.Marker({
      position: thisLatlng,
      map: map,
      icon: hotelimage,
      shadow: shadow,
      zIndex: 9999
  });
      google.maps.event.addListener(hotelmarker, 'click', function() {
        var ib = new InfoBox(ibOptions);
        boxText.innerHTML = hotelname;
        ib.open(map, hotelmarker);
        });

////////////////////


  google.maps.event.addListener(map, 'click', function() {
        infowindow.close();
        });

}

var airports = [
// This section was common to airport_float.php and flights.php, may still go with flights.php
[38.287242,-0.557299,'<b><u>Flights Guide - Alicante airport</u></b><br><table class="verdana"><tr><td width="135">Belfast </td><td>Aer Lingus, EasyJet, Flybe, Thomson </td></tr><tr><td>Birmingham </td><td>bmibaby, Monarch, Ryanair, Thomson </td></tr><tr><td>Blackpool </td><td>Jet2 </td></tr><tr><td>Bournemouth </td><td>Ryanair </td></tr><tr><td>Bristol </td><td>EasyJet, Ryanair, Thomson </td></tr><tr><td>Cardiff </td><td>bmibaby, Thomson </td></tr><tr><td>Cork </td><td>Aer Lingus </td></tr><tr><td>Doncaster Sheffield </td><td>Ryanair, Thomson </td></tr><tr><td>Dublin </td><td>Aer Lingus, Flybe, Ryanair </td></tr><tr><td>Durham Tees Valley </td><td>Ryanair, Thomson </td></tr><tr><td>East Midlands </td><td>bmibaby, Jet2, Ryanair, Thomson </td></tr><tr><td>Edinburgh </td><td>EasyJet, Flybe, Ryanair </td></tr><tr><td>Exeter </td><td>Flybe </td></tr><tr><td>Glasgow </td><td>EasyJet, Flybe, Jet2, Ryanair, Thomson </td></tr><tr><td>Guernsey </td><td>Flybe </td></tr><tr><td>Isle of Man </td><td>Flybe </td></tr><tr><td>Jersey </td><td>Flybe </td></tr><tr><td>Kerry </td><td>Ryanair </td></tr><tr><td>Knock </td><td>Ryanair </td></tr><tr><td>Leeds Bradford </td><td>Jet2, Flybe, Ryanair </td></tr><tr><td>Liverpool </td><td>EasyJet, Ryanair, </td></tr><tr><td>London Gatwick </td><td>EasyJet, Monarch, Ryanair, Thomson </td></tr><tr><td>London Luton </td><td>EasyJet, Monarch </td></tr><tr><td>London Stansted </td><td>airberlin, EasyJet, Ryanair </td></tr><tr><td>Manchester </td><td>EasyJet, Flybe, Jet2, Monarch, Thomson </td></tr><tr><td>Newcastle </td><td>EasyJet, Flybe, Jet2, Thomson </td></tr><tr><td>Newquay </td><td>Ryanair </td></tr><tr><td>Norwich </td><td>Thomson </td></tr><tr><td>Southampton </td><td>Flybe </td></tr></table>'],
[36.848101,-2.371502,'<b><u>Flights Guide - Almeria airport</u></b><br><table class="verdana"><tr><td width="130">Birmingham </td><td>Monarch </td></tr><tr><td>East Midlands </td><td>bmibaby </td></tr><tr><td>London Gatwick </td><td>EasyJet </td></tr><tr><td>London Stansted </td><td>Ryan Air </td></tr><tr><td>Manchester </td><td>Monarch </td></tr></table>'],
[43.559434,-6.032181,'<b><u>Flights Guide - Asturias (Oviedo) airport</u></b><br><table class="verdana"><tr><td width="130">Stansted</td><td>EasyJet</td></tr></table>'],
[41.29896,2.076931,'<b><u>Flights Guide - Barcelona airport</u></b><br><table class="verdana"><tr><td width="130">Belfast </td><td>Aer Lingus, EasyJet </td></tr><tr><td>Bristol </td<td>EasyJet </td></tr><tr><td>Cork </td><td>Aer Lingus </td></tr><tr><td>Doncaster Sheffield </td><td>EasyJet </td></tr><tr><td>Dublin </td><td>Aer Lingus, Ryanair </td></tr><tr><td>East Midlands </td><td>bmibaby </td></tr><tr><td>Edinburgh </td><td>Ryanair </td></tr><tr><td>Leeds Bradford </td><td>Jet2, Ryanair </td></tr><tr><td>Liverpool </td><td>EasyJet </td></tr><tr><td>London City </td><td>BA Cityflyer </td></tr><tr><td>London Gatwick </td><td>EasyJet </td></tr><tr><td>London Heathrow </td><td>British Airways </td></tr><tr><td>London Luton </td><td>EasyJet </td></tr><tr><td>London Stansted </td><td>airberlin, EasyJet </td></tr><tr><td>Manchester </td><td>Monarch </td></tr><tr><td>Newcastle </td><td>EasyJet </td></tr></table>'],
[43.305194,-2.906055,'<b><u>Flights Guide - Bilbao airport</u></b><br><table class="verdana"><tr><td width="130">Dublin </td><td>Aer Lingus </td></tr><tr><td>London Heathrow </td><td>Vueling </td></tr><tr><td>London Stansted </td><td>EasyJet </td></tr></table>'],
[36.152638,-5.348368,'<b><u>Flights Guide - Gibraltar airport</u></b><br><table class="verdana"><tr><td width="130">London Gatwick </td><td>EasyJet </td></tr><tr><td>London Heathrow </td><td>British Airways </td></tr><tr><td>Liverpool </td><td>EasyJet </td></tr><tr><td>London Luton </td><td>Monarch </td></tr><tr><td>Manchester </td><td>Monarch </td></tr></table>'],
[41.898827,2.765465,'<b><u>Flights Guide - Girona airport</u></b><br><table class="verdana"><tr><td width="130">Birmingham </td><td>Ryanair,Thomson </td></tr><tr><td>Bournemouth </td><td>Ryanair </td></tr><tr><td>Bristol </td><td>Ryanair </td></tr><tr><td>Dublin </td><td>Ryanair </td></tr><tr><td>East Midlands </td><td>Ryanair </td></tr><tr><td>Glasgow </td><td>Ryanair </td></tr><tr><td>Liverpool </td><td>Ryanair </td></tr><tr><td>London Gatwick </td><td>Ryanair,Thomson </td></tr><tr><td>London Luton </td><td>Ryanair </td></tr><tr><td>London Stansted </td><td>Ryanair </td></tr><tr><td>Manchester </td><td>Thomson </td></tr><tr><td>Newcastle </td><td>Ryanair </td></tr></table>'],
[37.185963,-3.776894,'<b><u>Flights Guide - Granada airport</u></b><br><table class="verdana"><tr><td>No flights from UK or Ireland at the moment</td></tr></table>'],
[38.876334,1.367626,'<b><u>Flights Guide - Ibiza airport</u></b><br><table class="verdana"><tr><td width="130">Aberdeen </td><td>Thomson </td></tr><tr><td width="130">Belfast </td><td>EasyJet, Jet2, Thomson </td></tr><tr><td>Birmingham </td><td>Monarch, Ryanair, Thomson </td></tr><tr><td>Bournemouth </td><td>Ryanair, Thomson </td></tr><tr><td>Bristol </td><td>EasyJet, Thomson </td></tr><tr><td>Cardiff </td><td>Bmibaby, Thomson </td></tr><tr><td>Doncaster Sheffield </td><td>Thomson </td></tr><tr><td>Dublin </td><td>Aer Lingus, Ryanair </td></tr><tr><td>East Midlands </td><td>Bmibaby, Ryanair, Thomson </td></tr><tr><td>Edinburgh </td><td>Jet2, Thomson </td></tr><tr><td>Exeter </td><td>Thomson </td></tr><tr><td>Glasgow </td><td>EasyJet, Ryanair, Thomson </td></tr><tr><td>Leeds Bradford </td><td>Jet2, Ryanair </td></tr><tr><td>Liverpool </td><td>EasyJet, Ryanair </td></tr><tr><td>London Gatwick </td><td>EasyJet, Monarch, Thomson </td></tr><tr><td>London Luton </td><td>EasyJet, Thomson </td></tr><tr><td>London Stansted </td><td>EasyJet, Ryanair, Thomson </td></tr><tr><td>Manchester </td><td>Jet2, Monarch, Thomson </td></tr><tr><td>Newcastle </td><td>EasyJet, Jet2, Thomson </td></tr><tr><td>Norwich </td><td>Thomson </td></tr></table>'],
[36.750164,-6.06411,'<b><u>Flights Guide - Jerez airport</u></b><br><table class="verdana"><tr><td width="130">London Stansted</td><td>Ryanair</td></tr></table>'],
[43.302071,-8.380938,'<b><u>Flights Guide - La Coruña airport</u></b><br><table class="verdana"><tr><td width="130">London Heathrow</td><td>Vueling</td></tr></table>'],
[40.46889,-3.56884,'<b><u>Flights Guide - Madrid airport</u></b><br><table class="verdana"><tr><td width="130">Bristol </td><td>EasyJet </td></tr><tr><td>Dublin </td><td>Aer Lingus, Ryan Air </td></tr><tr><td>Edinburgh </td><td>EasyJet </td></tr><tr><td>Liverpool </td><td>EasyJet </td></tr><tr><td>London City </td><td>BA Cityflyer </td></tr><tr><td>London Gatwick </td><td>EasyJet, Ryanair </td></tr><tr><td>London Heathrow </td><td>British Airways, Iberia </td></tr><tr><td>London Luton </td><td>EasyJet </td></tr><tr><td>London Stansted </td><td>Ryanair </td></tr></table>'],
[36.675578,-4.494438,'<b><u>Flights Guide - Malaga airport</u></b><br><table class="verdana"><tr><td width="130">Belfast </td><td>Aer Lingus, EasyJet, Flybe, Thomson </td></tr><tr><td>Birmingham </td><td>bmibaby, Monarch, Ryanair, Thomson </td></tr><tr><td>Blackpool </td><td>Jet2 </td></tr><tr><td>Bournemouth </td><td>Ryanair, Thomson </td></tr><tr><td>Bristol </td><td>EasyJet, Ryanair, Thomson </td></tr><tr><td>Cardiff </td><td>bmibaby, Thomson </td></tr><tr><td>Cork </td><td>Aer Lingus, Ryanair </td></tr><tr><td>Doncaster Sheffield </td><td>Thomson </td></tr><tr><td>Dublin </td><td>Aer Lingus, Flybe, Ryanair </td></tr><tr><td>East Midlands </td><td>bmibaby, Ryanair, Thomson </td></tr><tr><td>Edinburgh </td><td>Flybe, Jet2, Ryanair </td></tr><tr><td>Exeter </td><td>Flybe </td></tr><tr><td>Glasgow </td><td>EasyJet, Flybe, Ryanair, Thomson </td></tr><tr><td>Guernsey </td><td>Flybe </td></tr><tr><td>Jersey </td><td>Flybe </td></tr><tr><td>Leeds Bradford </td><td>Flybe, Jet2, Ryanair </td></tr><tr><td>Liverpool </td><td>EasyJet, Ryanair </td></tr><tr><td>London Gatwick </td><td>airberlin, Aer Lingus, EasyJet, Monarch, Thomson </td></tr><tr><td>London Heathrow </td><td>British Airways </td></tr><tr><td>London Luton </td><td>EasyJet, Monarch, </td></tr><tr><td>London Stansted </td><td>EasyJet, Ryanair </td></tr><tr><td>Manchester </td><td>EasyJet, Flybe, Monarch, Jet2, Thomson </td></tr><tr><td>Newcastle </td><td>EasyJet, Flybe, Jet2, Thomson </td></tr><tr><td>Shannon </td><td>Ryanair </td></tr><tr><td>Southampton </td><td>Flybe </td></tr></table>'],
[39.549059,2.731476,'<b><u>Flights Guide - Mallorca airport (Palma de Mallorca)</u></b><br><table class="verdana"><tr><td width="135">Aberdeen </td><td>Thomson </td></tr><tr><td>Belfast </td><td>EasyJet, Jet2, Thomson </td></tr><tr><td>Birmingham </td><td>bmibaby, Monarch, Ryanair, Thomson </td></tr><tr><td>Blackpool </td><td>Jet2 </td></tr><tr><td>Bournemouth </td><td>Ryanair, Thomson </td></tr><tr><td>Bristol </td><td>EasyJet, Ryanair, Thomson </td></tr><tr><td>Cardiff </td><td>Bmibaby, Thomson </td></tr><tr><td>Cork </td><td>Aer Lingus, Thomson </td></tr><tr><td>Derry </td><td>Thomson </td></tr><tr><td>Dublin </td><td>Aer Lingus, Ryanair, Thomson </td></tr><tr><td>Doncaster Sheffield </td><td>EasyJet, Thomson </td></tr><tr><td>Durham Tees Valley </td><td>Thomson </td></tr><tr><td>East Midlands </td><td>bmibaby, Jet2, Ryanair, Thomson </td></tr><tr><td>Edinburgh </td><td>EasyJet, Flybe, Jet2, Ryanair, Thomson </td></tr><tr><td>Exeter </td><td>Flybe, Thomson </td></tr><tr><td>Glasgow </td><td>EasyJet, Flybe, Jet2, Ryanair, Thomson </td></tr><tr><td>Guernsey </td><td>Flybe </td></tr><tr><td>Humberside </td><td>Thomson </td></tr><tr><td>Jersey </td><td>Flybe </td></tr><tr><td>Leeds Bradford </td><td>Flybe, Jet2, Ryanair, Thomson </td></tr><tr><td>Liverpool </td><td>EasyJet, Ryanair </td></tr><tr><td>London Gatwick </td><td>airberlin, EasyJet, Monarch, Thomson </td></tr><tr><td>London Luton </td><td>EasyJet, Monarch, Thomson </td></tr><tr><td>London Stansted </td><td>airberlin, EasyJet, Ryanair, Thomson </td></tr><tr><td>Manchester </td><td>bmibaby, EasyJet, Flybe, Jet2, Monarch, Thomson </td></tr><tr><td>Newcastle </td><td>EasyJet, Flybe, Jet2, Thomson </td></tr><tr><td>Norwich </td><td>Thomson </td></tr><tr><td>Shannon </td><td>Ryanair, Thomson </td></tr><tr><td>Southampton </td><td>Flybe, Thomson </td></tr></tr></table>'],
[39.864821,4.226303,'<b><u>Flights Guide - Menorca airport (Mahon)</u></b><br><table class="verdana"><tr><td width="135">Aberdeen </td><td>Thomson </td></tr><tr><td>Belfast </td><td>Jet2 </td></tr><tr><td>Birmingham </td><td>Monarch Thomson </td></tr><tr><td>Bristol </td><td>EasyJet, Thomson </td></tr><tr><td>Cardiff </td><td>Bmibaby, Thomson </td></tr><tr><td>Doncaster Sheffield </td><td>Thomson </td></tr><tr><td>East Midlands </td><td>bmibaby, Thomson </td></tr><tr><td>Edinburgh </td><td>Jet2 </td></tr><tr><td>Exeter </td><td>Thomson </td></tr><tr><td>Glasgow </td><td>Thomson </td></tr><tr><td>Leeds Bradford </td><td>Jet2 </td></tr><tr><td>Liverpool </td><td>EasyJet </td></tr><tr><td>London Gatwick </td><td>EasyJet, Monarch, Thomson </td></tr><tr><td>London Luton </td><td>EasyJet, Monarch, Thomson </td></tr><tr><td>London Stansted </td><td>Thomson </td></tr><tr><td>Manchester </td><td>EasyJet, Monarch, Thomson </td></tr><tr><td>Newcastle </td><td>EasyJet, Jet2, Thomson </td></tr><tr><td>Norwich </td><td>Thomson </td></tr></table>'],
[37.775192,-0.817623,'<b><u>Flights Guide - Murcia airport</u></b><br><table class="verdana"><tr><td width="130">Belfast </td><td>Jet2 </td></tr><tr><td>Birmingham </td><td>bmibaby, Ryanair </td></tr><tr><td>Blackpool </td><td>Jet2 </td></tr><tr><td>Bournemouth </td><td>Ryanair </td></tr><tr><td>Bristol </td><td>EasyJet </td></tr><tr><td>Cardiff </td><td>bmibaby </td></tr><tr><td>Dublin </td><td>Ryanair </td></tr><tr><td>East Midlands </td><td>Ryanair </td></tr><tr><td>Edinburgh </td><td>Jet2 </td></tr><tr><td>Glasgow </td><td>Ryanair </td></tr><tr><td>Leeds Bradford </td><td>Jet2, Ryanair </td></tr><tr><td>Liverpool </td><td>Ryanair </td></tr><tr><td>London Gatwick </td><td>EasyJet </td></tr><tr><td>London Luton </td><td>Ryanair </td></tr><tr><td>London Stansted </td><td>Ryanair </td></tr><tr><td>Manchester </td><td>Jet2 </td></tr><tr><td>Newcastle </td><td>EasyJet, Jet2 </td></tr></table>'],
[41.147509,1.156311,'<b><u>Flights Guide - Reus airport</u></b><br><table class="verdana"><tr><td width="130">Belfast </td><td>Thomson </td></tr><tr><td>Birmingham </td><td>Ryanair, Thomson </td></tr><tr><td>Bristol </td><td>Ryanair, Thomson </td></tr><tr><td>Cardiff </td><td>Thomson </td></tr><tr><td>Cork </td><td>Thomson </td></tr><tr><td>Derry </td><td>Thomson </td></tr><tr><td>Doncaster Sheffield </td><td>Thomson </td></tr><tr><td>Dublin </td><td>Ryanair, Thomson </td></tr><tr><td>East Midlands </td><td>Ryanair, Thomson </td></tr><tr><td>Glasgow </td><td>Ryanair, Thomson </td></tr><tr><td>Liverpool </td><td>Ryanair </td></tr><tr><td>London Gatwick </td><td>Thomson </td></tr><tr><td>London Luton </td><td>Ryanair, Thomson </td></tr><tr><td>London Stansted </td><td>Ryanair </td></tr><tr><td>Manchester </td><td>Jet2, Thomson </td></tr><tr><td>Newcastle </td><td>Thomson </td></tr><tr><td>Shannon </td><td>Thomson </td></tr></table>'],
[43.423315,-3.824015,'<b><u>Flights Guide - Santander airport</u></b><br><table class="verdana"><tr><td width="130">Dublin</td><td>Ryanair</td></tr><tr><td>London Stansted</td><td>Ryanair</td></tr></table>'],
[42.898604,-8.420506,'<b><u>Santiago de Compostela airport</u></b><br><table class="verdana"><tr><td width="130">Dublin</td><td>Aer Lingus</td></tr><tr><td>London Stansted</td><td>Ryanair</td></tr></table>'],
[37.423139,-5.899572,'<b><u>Flights Guide - Seville airport</u></b><br><table class="verdana"><tr><td width="130">Bristol </td><td>Ryanair </td></tr><tr><td>Dublin </td><td>Ryanair </td></tr><tr><td>Liverpool </td><td>Ryanair </td></tr><tr><td>London Gatwick </td><td>Ryanair </td></tr><tr><td>London Stansted </td><td>Ryanair </td></tr><tr><td>London Heathrow </td><td>Vueling </td></tr></table>'],
[39.492119,-0.476704,'<b><u>Flights Guide - Valencia airport</u></b><br><table class="verdana"><tr><td width="130">Bristol </td><td>EasyJet, Ryanair </td></tr><tr><td>Dublin </td><td>Ryanair </td></tr><tr><td>East Midlands </td><td>Ryanair </td></tr><tr><td>London Gatwick </td><td>EasyJet </td></tr><tr><td>London Stansted </td><td>Ryanair </td></tr></table>'],
[41.70701,-4.846344,'<b><u>Flights Guide - Valladolid airport</u></b><br><table class="verdana"><tr><td width="130">Stansted</td><td>Ryanair</td></tr></table>'],
[42.883134,-2.730618,'<b><u>Flights Guide - Vitoria airport</u></b><br><table class="verdana"><tr><td>No flights from UK or Ireland at the moment</td></tr></table>'],
[41.663359,-1.008167,'<b><u>Flights Guide - Zaragoza airport</u></b><br><table class="verdana"><tr><td width="130">Stansted</td><td>Ryanair</td></tr></table>']
// End of common section
];

function setMarkers(map, locations) {
var airimage = new google.maps.MarkerImage(
  '../images/air_icon.png',
      new google.maps.Size(32, 37),
      new google.maps.Point(0,0),
      new google.maps.Point(16, 35));

var airshadow = new google.maps.MarkerImage(
  '../images/hotel_shadow.png',
      new google.maps.Size(51, 37),
      new google.maps.Point(0,0),
      new google.maps.Point(16, 35));

  for (var i = 0; i < locations.length; i++) {
    var airport = locations[i];
    var infocontent = airport [2]
    var myLatLng = new google.maps.LatLng(airport[0], airport[1]);
    var marker = new google.maps.Marker({
        position: myLatLng,
        map: map,
        icon: airimage,
        shadow: airshadow
    });
      google.maps.event.addListener(marker, 'click', function() {
        var ib = new InfoBox(ibOptions);
        boxText.innerHTML = infocontent;
        ib.open(map, marker);
        });
}
}

//]]>
</script> 
</head> 

<body onload="initialize()"> 
<div id="content">
<h1>Location - <?php echo $hotel; ?></h1>
<span class="verdana"><br /></span>
<table border=1 bordercolor="#666666">
      <tr>
        <td>
<div id="map_canvas" style="width: 640px; height: 450px"></div>
        </td>
      </tr>
</table>
<br />
</div>
</body> 
</html> 

还有许多琐事尚待解决,例如信息框选项的格式,但首先我需要使该东西正常工作.我怀疑问题出在脚本结尾附近的"addListener",但是我看不到它.

There are various trivia still to be sorted out, like the formatting of the infobox options but first I need to get the thing working. I suspect the problem lies in the "addListener" near the end of the script, but I just can't see it.

推荐答案

Ciao!

@Chang是个正确的主意,但闭包当然应该在有[i]

@Chang has the right idea, but the closure should of course include the airport definition where there's an [i]

  var ib = new InfoBox(ibOptions);

  for (var i = 0; i < locations.length; i++) {
    (function(i) {
    var airport = locations[i];
    var infocontent = airport [2]
    var myLatLng = new google.maps.LatLng(airport[0], airport[1]);
    var marker = new google.maps.Marker({
        position: myLatLng,
        map: map,
        icon: airimage,
        shadow: airshadow
    });
      google.maps.event.addListener(marker, 'click', function() {
        boxText.innerHTML = infocontent;
        ib.close();
        ib.open(map, marker);
        });
    })(i); 
  }

在进行测试时,我注意到InfoBox变得非常庞大.我向您介绍的两个想法是:

As I was testing I noticed the InfoBoxes become huge. The two ideas I present to you are:

  1. 更改boxStyle:在我的浏览器Chrome中,滚动条与该框不对齐,很简单,但是很丑.

  1. Change boxStyle: Easy, but ugly because the scrollbar does not line up with the box, in my browser Chrome.

       var ibOptions = {
         content: boxText
        ,disableAutoPan: false
        ,maxWidth: 0
        ,pixelOffset: new google.maps.Size(10, -50)
        ,zIndex: null
        ,boxStyle: { 
          width: "180px", // widened because of the scrollbar
          height: "150px",
          overflow: "auto"
         }

  • 更改表格的样式.在您的情况下,您将表格样式称为"verdana".不太丑陋,但是需要工作,因此工作方式没有那么多.

  • Change the style of your tables. In your case you call table styles "verdana". Less ugly, but needs work so it's not so much in the way..

    .verdana {display:block;最大高度:150像素;溢出-y:自动; }

    .verdana { display: block; max-height: 150px; overflow-y: auto; }

    Ciao!

    这篇关于将Google Maps InfoBox用于存储在数组中的点的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

  • 查看全文
    登录 关闭
    扫码关注1秒登录
    发送“验证码”获取 | 15天全站免登陆