﻿
//<![CDATA[

  if (GBrowserIsCompatible()) {

      var baseIcon = new GIcon();
      baseIcon.shadow = "http://www.google.com/mapfiles/shadow50.png";
      baseIcon.iconSize = new GSize(20, 34);
      baseIcon.shadowSize = new GSize(37, 34);
      baseIcon.iconAnchor = new GPoint(9, 34);
      baseIcon.infoWindowAnchor = new GPoint(9, 2);
      baseIcon.infoShadowAnchor = new GPoint(18, 25);

      var sidebar_html = "";
      var gmarkers = [];
      var htmls = [];
      var i = 0;
      var map = new GMap2(document.getElementById("map"));
      map.addControl(new GLargeMapControl3D());
      map.addControl(new GMapTypeControl());
      map.setCenter(new GLatLng(35.163032, 137.010452), 14);
      map.enableScrollWheelZoom();
      map.addControl(new GScaleControl());

map.addControl(new GOverviewMapControl());

      var opts = new Object();
      opts.zoomLevel = 19;
      opts.mapType = G_HYBRID_MAP;


      function createMarker(point,label,name,html,index) {
        var letter = String.fromCharCode("A".charCodeAt(0) + index);
        var icon = new GIcon(baseIcon);
        icon.image = "http://www.google.com/mapfiles/marker" + letter + ".png";
        var marker = new GMarker(point, icon);
        GEvent.addListener(marker, "click", function() {
          marker.openInfoWindowHtml('<div style="white-space:nowrap;">'+html+'<\/div>', '"Marker <b>" + letter + "<\/b>"');
        });
        gmarkers[i] = marker;
        htmls[i] = html;
        sidebar_html += '<div class="label" style="background-color: #ffeac0; font-weight: bold; padding-left: 3px; margin-top: 4px; margin-bottom: 4px;">' + label + '<\/div><a href="javascript:myclick(' + i + ')">' + name + '<\/a>';
        i++;
        return marker;
      }
      function myclick(i) {
        gmarkers[i].openInfoWindowHtml('<div style="white-space:nowrap;">'+htmls[i]+'<\/div>');
      }
      function Adentro(i) { 
        map.setCenter(gmarkers[i].point,17);
      }
      function Fuera(i) { 
        map.setCenter(gmarkers[i].point,12); 
      } 

// === 所在地 ===

            var point = new GLatLng(35.163032, 137.010452);
            var label = ''; // ★続くのでここを空白に
            var html = '(有)SakaiDesign<br />名古屋市名東区陸前町2201-2シャトー貴船101号<br />Tel&Fax: (052)704-3958<br />最寄り駅：地下鉄 上社/本郷<br /><br /><span class="info">[<a href="javascript:Adentro('+i+');">zoom in<\/a>] - [<a href="javascript:Fuera('+i+');">zoom out<\/a>]<\/span>';
            var marker = createMarker(point, label, 'A (有)Sakai Design', html, 0);
            map.addOverlay(marker);

map.showMapBlowup(point, opts);

// === 駅 ===
            var point = new GLatLng(35.173668,137.007065);
            var label = '駅';
            var html = '上社駅<br />名古屋地下鉄<br /><br /><span class="info">[<a href="javascript:Adentro('+i+');">zoom in<\/a>] - [<a href="javascript:Fuera('+i+');">zoom out<\/a>]<\/span>';
            var marker = createMarker(point, label, 'B 上社駅', html, 1);
            map.addOverlay(marker);

            var point = new GLatLng(35.175457, 137.013288);
            var label = '';
            var html = '本郷駅<br />名古屋地下鉄<br /><br /><span class="info">[<a href="javascript:Adentro('+i+');">zoom in<\/a>] - [<a href="javascript:Fuera('+i+');">zoom out<\/a>]<\/span>';
            var marker = createMarker(point, label, 'C 本郷駅', html, 2);
            map.addOverlay(marker);

            var point = new GLatLng(35.170932, 136.881859);
            var label = ''; // ★続くのでここを空白に
            var html = '名古屋駅<br />総合駅<br /><br /><span class="info">[<a href="javascript:Adentro('+i+');">zoom in<\/a>] - [<a href="javascript:Fuera('+i+');">zoom out<\/a>]<\/span>';
            var marker = createMarker(point, label, 'D 名古屋駅', html, 3);
            map.addOverlay(marker);

// === 高速 ===
            var point = new GLatLng(35.170721, 137.023716);
            var label = '高速IC';
            var html = '名古屋インター<br />東名高速道路<br /><br /><span class="info">[<a href="javascript:Adentro('+i+');">zoom in<\/a>] - [<a href="javascript:Fuera('+i+');">zoom out<\/a>]<\/span>';
            var marker = createMarker(point, label, 'E 名古屋インター', html, 4);
            map.addOverlay(marker);

            var point = new GLatLng(35.176053, 137.003031);
            var label = ''; // ★続くのでここを空白に
            var html = '上社インター<br />東名阪自動車道<br /><br /><span class="info">[<a href="javascript:Adentro('+i+');">zoom in<\/a>] - [<a href="javascript:Fuera('+i+');">zoom out<\/a>]<\/span>';
            var marker = createMarker(point, label, 'F 上社インター', html, 5);
            map.addOverlay(marker);

      document.getElementById("sidebar").innerHTML = sidebar_html;
  }
//]]>

