﻿
    
    
    //<![CDATA[

    if (GBrowserIsCompatible()) {
      
      // this variable will collect the html which will eventualkly be placed in the sidebar
      var sidebar_html = "";
    
      // arrays to hold copies of the markers and html used by the sidebar
      // because the function closure trick doesnt work there
      var gmarkers = [];
      var htmls = [];
      var i = 0;


      // A function to create the marker and set up the event window
      function createMarker(point,name,html) {
        var marker = new GMarker(point);
        GEvent.addListener(marker, "click", function() {
          marker.openInfoWindowHtml(html);
        });
        
        // The new marker "mouseover" listener        
        GEvent.addListener(marker,"mouseover", function() {
          marker.openInfoWindowHtml(html);
        });    
        
        // The new marker "close" listener        
        GEvent.addListener(marker, "dblclick", function() {
          map.closeInfoWindow();
        });    
        
        // save the info we need to use later for the sidebar
        gmarkers[i] = marker;
        htmls[i] = html;
        // add a line to the sidebar html
        sidebar_html += '<li><a href="javascript:myclick(' + i + ')">' + name + '</a></li>';
        i++;
        return marker;
      }


      // This function picks up the click and opens the corresponding info window
      function myclick(i) {
        gmarkers[i].openInfoWindowHtml(htmls[i]);
      }


      // Display the map, with some controls and set the initial location 
      var map = new GMap(document.getElementById("map"));
      map.setMapType(G_SATELLITE_MAP); 
      map.addControl(new GLargeMapControl());
      map.addControl(new GScaleControl());
      map.addControl(new GOverviewMapControl());   
      map.addControl(new GMapTypeControl());
      GEvent.addListener(map, "moveend", function() {
        var center = map.getCenterLatLng();
        var latLngStr = '目前地圖中心點位置經緯度: ( ' + center.x + ', ' + center.y + ' ) - - &copy; 2006 Mike Lin - - <a href="mailto:golden360@hotmail.com">合作提案</a>';
        document.getElementById("message").innerHTML = latLngStr;
      });      
      map.centerAndZoom(new GPoint(120.26321411132812, 23.059516273509317), 5);

      // add the points   

      var point = new GPoint(120.18742561340332, 23.041193363506817);
      var marker = createMarker(point,'國道8號起點(與台17甲交匯處-海佃路)','國道8號起點(與台17甲交匯處-海佃路)')
      map.addOverlay(marker);  

      var point = new GPoint(120.21265983581543, 23.089680457617007);
      var marker = createMarker(point,'新吉交流道(可接台19線)','新吉交流道(可接台19線)')
      map.addOverlay(marker);   
      
      var point = new GPoint(120.25222778320312, 23.079100074408128);
      var marker = createMarker(point,'台南系統交流道(國8號與國1號交匯處)','台南系統交流道(國8號與國1號交匯處)')
      map.addOverlay(marker); 
      
      var point = new GPoint(120.28080940246582, 23.061964404517532);
      var marker = createMarker(point,'新市交流道(與台1線交匯處)','新市交流道(與台1線交匯處)')
      map.addOverlay(marker);        
      
      var point = new GPoint(120.32398223876953, 23.06409661136831);
      var marker = createMarker(point,'新化系統交流道(國8號與國3號交匯處)','新化系統交流道(國8號與國3號交匯處)')
      map.addOverlay(marker); 
      
      var point = new GPoint(120.33205032348633, 23.060858802479874);
      var marker = createMarker(point,'國道8號終點(新化端﹐國8號與台20線交匯處)','國道8號終點(新化端﹐國8號與台20線交匯處)')
      map.addOverlay(marker); 
               
                       
      // put the assembled sidebar_html contents into the sidebar div
      document.getElementById("sidebar").innerHTML = sidebar_html;
      
    }

    else {
      alert("Sorry, the Google Maps API is not compatible with this browser");
    }

    // This Javascript is based on code provided by the
    // Blackpool Community Church Javascript Team
    // http://www.commchurch.freeserve.co.uk/   
    // http://www.econym.demon.co.uk/googlemaps/

    //]]>

