Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Feb 2013
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Lightbulb MapViews on Android using Google Maps API & Javascript Adding a Link to Info Bubble

    I'm looking for some help making a modification to this code. I want to add a clickable link in the info window that pops up when you click on the marker. Right now I've got Name and Notes showing up, but can't seem to get a clickable URL. Any guidance would be greatly appreciated. Credit to the original code goes to JasonSchroeder over at Corona.

    Code:
    
    ------------------------
    --REQUIRED VARIABLES
    ------------------------
     
    local APIkey = "YOUR_API_KEY"
            --This variable is your Google Maps API key (copy and paste it from the web). You can obtain a Google Maps API Key for free at http://code.google.com/apis/console
     
    local lat, lon = 37.450876, -122.156689
            --These are the latitude and longitude values where our map will center when it first loads.
     
    local path = system.pathForFile( "map.html", system.DocumentsDirectory )
            --This is the path for the HTML document that we'll create to load our custom Google Map.
            
            
            
    ------------------------
    --OPTIONAL MARKER DATA
    ------------------------
     
    local markerTable = {}
            --This table will contain all of the data for our map markers.
     
            markerTable[1]={
                    name = "Ansca HQ",
                    lat = 37.450876,
                    lon = -122.156689,
                    notes = "Play more. Code less."
                    }
                    
            markerTable[2]={
                    name = "Chipotle Mexican Grill",
                    lat = 37.4238658,
                    lon = -122.1433494,
                    notes = "Because Corona is even tastier with a burrito in your hand."
                    }
            
            -- The above variables contain data for 2 markers. You can place additional markers, or attach other pieces of data to each marker (address, phone #, etc.)
     
     
    local markerCode = {}
            --This table will contain the compiled Javascript to place the markers we specified in the markerList table.
            
     
    for i=1 , #markerTable do
            markerCode[i] = [[
            
            var infowindow]]..i..[[ = new google.maps.InfoWindow({
            content: "<strong>]]..markerTable[i].name..[[</strong><br>]]..markerTable[i].notes..[["
            });
            
            var marker]]..i..[[ = new google.maps.Marker({
            position: new google.maps.LatLng(]]..markerTable[i].lat..', '..markerTable[i].lon..[[),
            map: map,
            animation: google.maps.Animation.DROP,
            });
            
            
            google.maps.event.addListener(marker]]..i..[[, 'click', function() {
            infowindow]]..i..[[.open(map,marker]]..i..[[);
            });
     
            ]]
            end
     
    local markerString = table.concat(markerCode)
            --The above code compiles a string that contains all of our marker data, to be inserted (optionally) into the HTML file we're creating.

  • #2
    New Coder
    Join Date
    May 2004
    Posts
    15
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by appoet View Post
    Code:
            var infowindow]]..i..[[ = new google.maps.InfoWindow({
            content: "<strong><a href='http://www.gogole.com'>Google</a></strong><br>]]..markerTable[i].notes..[["
            });
    That should put a link to google in your infobox (popup)!?

  • #3
    New to the CF scene
    Join Date
    Feb 2013
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Figured it out actually- you're going to want to do this -

    <code> var infowindow]]..i..[[ = new google.maps.InfoWindow({
    content: "<strong>]]..markerTable[i].name..[[</strong><br>]]..markerTable[i].notes..[[<br><a href=\"]]..markerTable[i].url..[[\" target=\"_blank\">Read Now</a>"
    }); </code>

    and put the URL in the marker table field


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •