0 Replies Latest reply on Apr 1, 2010 1:24 PM by TexasLakes

    Google Maps API, using XML, unable to get link

    TexasLakes

      I am using Google maps API for Flash, I have ran into a problem with the XML file, I can't seem to put a hyperlink into the info window.  It will display the text but is not a functioning link.  I am not a programmer, and actually this is derived from a demo that I've modified.

      If anyone could please help me, I'm a NEWB...  thanx in advance.

      the page is located here:  http://boatingtexaslakes.com/Lakes/EagleMountain/EagleMountain.html

      and a ZIP with all the files is located here: http://boatingtexaslakes.com/Help/Map.zip

      The syntax of the xml is like this:

       

      <marker name="Texas Health, Harris Methodist Hospital" desc=""
      street="108 Denver Trail," city="Azle, TX 76020"
      number="(817) 444-8600" web="TexasHealth.org" lat="32.881042" lng="-97.533197" type="emergency" />

      my flash looks like this:

       

      import com.google.maps.LatLng;
      import com.google.maps.LatLngBounds;
      import com.google.maps.Map;
      import com.google.maps.MapEvent;
      import com.google.maps.MapMouseEvent;
      import com.google.maps.MapType;
      import com.google.maps.controls.ZoomControl;
      import com.google.maps.controls.PositionControl;
      import com.google.maps.controls.MapTypeControl;
      import com.google.maps.overlays.Marker;
      import com.google.maps.overlays.MarkerOptions;
      import com.google.maps.InfoWindowOptions;
      import com.google.maps.styles.FillStyle;
      import com.google.maps.controls.ZoomControl;
       
      var categories:Object =
      { "restaurant": {
          "color": 0xFF0000,
          "markers": []},

      "bar": {
          "color": 0x0000FF,
          "markers": []},

      "fuel": {
          "color": 0x00FF00,
          "markers": []},

      "marina": {
          "color": 0x9900FF,
          "markers": []},

      "lodging": {
          "color": 0xFF6600,
          "markers": []},
       
      "hotel": {
          "color": 0xFFFF99,
          "markers": []},

      "parks": {
          "color": 0x00CC33,
          "markers": []},

      "extra1": {
          "color": 0x66CCFF,
          "markers": []},

      "extra2": {
          "color": 0x99CCFF,
          "markers": []},

      "extra3": {
          "color": 0xCCCCFF,
          "markers": []},

      "extra4": {
          "color": 0xFFCCFF,
          "markers": []},

      "bait": {
          "color": 0x000066,
          "markers": []},

      "parts": {
          "color": 0x0066FF,
          "markers": []},

      "emergency": {
          "color": 0x000000,
          "markers": []}

      };
       
      // Create The Map
      var map:Map = new Map();
      map.key = "ABQIAAAAf5-165BMQmKxjaLOL25KtxR0rWX2NzEi0mkcYk8j_nRX5ZubdhSINLmEr5z4uuRBY3fDIgjxdh7cDw";
      map.x = 90;
      map.y = 0;
      map.setSize(new Point(stage.stageWidth-90, stage.stageHeight));
      map.addEventListener(MapEvent.MAP_READY, onMapReady);
      this.addChild(map);
       
      restaurantsCheckbox.addEventListener(MouseEvent.CLICK, function(e:Event) {
        toggleCategory("restaurant");                 
      });
      barsCheckbox.addEventListener(MouseEvent.CLICK, function(e:Event) {
        toggleCategory("bar");                 
      });
      fuelCheckbox.addEventListener(MouseEvent.CLICK, function(e:Event) {
        toggleCategory("fuel");                 
      });
      marinaCheckbox.addEventListener(MouseEvent.CLICK, function(e:Event) {
        toggleCategory("marina");                 
      });
      lodgingCheckbox.addEventListener(MouseEvent.CLICK, function(e:Event) {
        toggleCategory("lodging");                 
      });
      hotelsCheckbox.addEventListener(MouseEvent.CLICK, function(e:Event) {
        toggleCategory("hotel");                 
      });
      parksCheckbox.addEventListener(MouseEvent.CLICK, function(e:Event) {
        toggleCategory("parks");                 
      });
      extra1Checkbox.addEventListener(MouseEvent.CLICK, function(e:Event) {
        toggleCategory("extra1");                 
      });
      extra2Checkbox.addEventListener(MouseEvent.CLICK, function(e:Event) {
        toggleCategory("extra2");                 
      });
      extra3Checkbox.addEventListener(MouseEvent.CLICK, function(e:Event) {
        toggleCategory("extra3");                 
      });
      extra4Checkbox.addEventListener(MouseEvent.CLICK, function(e:Event) {
        toggleCategory("extra4");                 
      });
      baitCheckbox.addEventListener(MouseEvent.CLICK, function(e:Event) {
        toggleCategory("bait");                 
      });
      partsCheckbox.addEventListener(MouseEvent.CLICK, function(e:Event) {
        toggleCategory("parts");                 
      });
      emergencyCheckbox.addEventListener(MouseEvent.CLICK, function(e:Event) {
        toggleCategory("emergency");                 
      });
      function onMapReady(event:MapEvent):void {
        map.setCenter(new LatLng(31.974048,-96.252688),11, MapType.PHYSICAL_MAP_TYPE);
        map.addControl(new ZoomControl());
        map.addControl(new PositionControl());
        map.addControl(new MapTypeControl());
              
        var xmlString:URLRequest = new URLRequest("markers.xml");
        var xmlLoader:URLLoader = new URLLoader(xmlString);
        xmlLoader.addEventListener("complete", readXml);
      }

      function readXml(event:Event):void{
        var markersXML:XML = new XML(event.target.data);
        var markers:XMLList = markersXML..marker;
        var markersCount:int = markers.length();
             
        for (var i:Number = 0; i < markersCount; i++) {
          var marker:XML = markers[i];
          var name:String = marker.@name;
          var desc:String = marker.@desc;
      var street:String = marker.@street;
      var city:String = marker.@city;
      var number:String = marker.@number;
      var web:String= marker.@web;
      var type:String = marker.@type;
          var latlng:LatLng = new LatLng(marker.@lat, marker.@lng);
            createMarker(latlng, name, desc, street, city, number, web, type);
          }
      }


      function createMarker(latlng:LatLng,name:String,desc:String,street:String,city:String,number:Strin g,web:String,type:String):void {
        var markerOptions:MarkerOptions = new MarkerOptions({});
        var fillStyle:FillStyle = new FillStyle({color: categories[type].color});
        markerOptions.fillStyle = fillStyle;
             
        var marker:Marker = new Marker(latlng, markerOptions);
        var html:String = "<b>" + name + "</b> <br/>" + desc + "</b> <br/>" + street + "</b> <br/>" + city + "</b> <br/>" + number + "</b> <br/>" + web;
        marker.addEventListener(MapMouseEvent.CLICK, function(e:MapMouseEvent):void {
          marker.openInfoWindow(new InfoWindowOptions({contentHTML:html}));
        });
        categories[type].markers.push(marker);
        map.addOverlay(marker);
      }
      function toggleCategory(type:String):void {
        for (var i:Number = 0; i < categories[type].markers.length; i++) {
          var marker:Marker = categories[type].markers[i];
          if (!marker.visible) {
            marker.visible = true;
          } else {
            marker.visible = false;
          }
        }
      }