Question

我为项目写了一些javascript和html代码。我想在javascript中使用一个新功能，但我没有得到任何进一步的功能。我有一个带有标记的地图API，我有一张带有图像和地址的表格。现在，当我点击图像时，我希望地图显示在地图上。这是我的代码：

<table>
       <tr>
            <th colspan="3">Rijn IJssel Locaties</th>
       </tr>
       <tr>
            <td><img id="action" type="button" value="Show map" class="locatiepic" 
                 src="images/rijnijssel.jpg">
                <br> Rijn IJssel - Zijpendaalseweg 167</td>
            <td><img class="locatiepic"
                 src="images/Rijn%20IJssel%20locatie%20Alexanderstraat.png">
                <br> Rijn IJssel - Alexanderstraat 35</td>
            <td><img class="locatiepic" src="images/Rijn%20IJssel%20-
                %20Apeldoornseweg%20210a.jpg">
                <br> <p> Rijn IJssel - Apeldoornseweg 210a</p> </td>
      </tr>
<table>

在javascript下面：

<script type="text/javascript">
var locations = [
  ['Rijn IJssel - Zijpendaalseweg 167', 51.996098, 5.891174, 'Arnhem'],
  ['Rijn IJssel - Alexanderstraat 35', 51.9847458, 5.8808427, 'Arnhem'],
  ['Rijn IJssel - Apeldoornseweg 210a', 51.990575, 5.908738, 'Arnhem'],
  ['Rijn IJssel - Beukenlaan 3', 52.0043576, 5.9268341, 'Arnhem'],
  ['Rijn IJssel - Korianderstraat 81', 51.9671908, 5.9189638, 'Arnhem'],
  ['Rijn IJssel - Utrechtsestraat 40/42', 51.984172, 5.897613, 'Arnhem'],
  ['Rijn IJssel - Veluwestraat 120', 51.989220, 5.887532, 'Arnhem'],
  ['Rijn IJssel - Kronenburgsingel 16', 51.960555, 5.899545, 'Arnhem'],
  ['Rijn IJssel - Kamillelaan 8-10-12', 51.9658918, 5.9180286, 'Arnhem'],
  ['Rijn IJssel - Middachtensingle 2', 51.984267, 5.956816, 'Arnhem'],
  ['Rijn IJssel - Velperweg 39', 51.9875672, 5.9263741, 'Arnhem'],
  ['Rijn IJssel - Papendallaan 51', 52.0108996, 5.8156799, 'Arnhem'],
  ['Rijn IJssel - Thorbeckestraat 6', 51.981106, 5.926297, 'Arnhem'],
  ['Rijn IJssel - Nijverheidsstraat 67a', 51.908003, 5.925714, 'Bemmel'],
  ['Rijn IJssel - Tellegenlaan 2', 52.051328, 6.099109, 'Dieren'],
  ['Rijn IJssel - Pr. Irenestraat 49', 51.920011, 5.846170, 'Elst'],
  ['Rijn IJssel - Groeneweg 14', 51.9746782, 5.7347855, 'Renkum'],
  ['Rijn IJssel - Hutteweg 24', 51.895614, 6.382502, 'Ulft'],
  ['Rijn IJssel - Marijkeweg 5', 51.9692226, 5.6524946, 'Wageningen'],
  ['Rijn IJssel - Marijkeweg 20', 51.9694141, 5.6540805, 'Wageningen'],
  ['Rijn IJssel - Babberichseweg 23', 51.927324, 6.081011, 'Zevenaar'],
  ['Rijn IJssel - Stationsplein 8', 51.923190, 6.074446, 'Zevenaar'],
];

// Maps verbinden aan id "maps"
var map = new google.maps.Map(document.getElementById('map'), {
    // Maps zoom afstand level 16
    zoom: 16,
    // Begin locatie
    center: new google.maps.LatLng(51.996098, 5.891174),
    // Map stijl
    mapTypeId: google.maps.MapTypeId.map
});

// info vakje bij klikken op locatie marker
var infowindow = new google.maps.InfoWindow();

var marker, i;

// Markers plaatsen
for (i = 0; i < locations.length; i++) {
    marker = new google.maps.Marker({
        position: new google.maps.LatLng(locations[i][1], locations[i][2]),
        map: map
    });

    google.maps.event.addListener(marker, 'click', (function (marker, i) {
        return function () {
          infowindow.setContent(locations[i][0]);
            infowindow.open(map, marker);
        }
    })(marker, i));
}



function clickroute(lati, long) {
    var latLng = new google.maps.LatLng(lati, long);
    map.panTo(latLng);
}

我尝试了几件事，但我无法通过它。

点击按钮 - ＆gt;在地图上显示标记

0 个答案: