javascript - Displaying links in google maps infowindow for multiple markers using Rails 3.1 - Stack Overflow

admin管理员组

文章数量:1356771

I have a map with multiple markers of panies using google maps API v3. I need to link from the infowindow to the pany show view of my application, so if I click on the marker an infowindow opens with some basic information and a link to view the details of the pany. The code is this:

class CitiesController < ApplicationController

...

def businessmap
    @city = City.find(params[:id])
    @mapcenter = @city.geocode
    @businesses = @city.businesses
    respond_to do |format|
      format.html
      format.json { render :json => @businesses.to_json(:only => [:id, :business_name, :phone, :latitude, :longitude]) }
    end
  end
end

The mapview itself is here:

%script{:type => "text/javascript", :charset => "utf-8", :src => ".6&sensor=false&region=IN"}
%script{:type => "text/javascript"}
  function initialize() {

  var cityLatlng = new google.maps.LatLng(
  = @mapcenter[0]
  ,
  = @mapcenter[1]
  );

  var options = {
  zoom: 13,
  center: cityLatlng,
  mapTypeId: google.maps.MapTypeId.ROADMAP
  };

  var map = new google.maps.Map(document.getElementById("map_canvas"), options);

  $.getJSON('businessmap.json', function(businesses) {
  $(businesses).each(function() {
  var business = this;
  var infowindow = new google.maps.InfoWindow({
  content: business.business_name + '<br/>' + 'Phone: ' + business.phone
  });
  var marker = new google.maps.Marker({
  position: new google.maps.LatLng(business.latitude, business.longitude),
  map: map,
  icon: image
  });
  google.maps.event.addListener(marker, 'click', function() {
  infowindow.open(map,marker);
  });
  });
  });
  }

%body{ :onload => "initialize()" }
  %div#map_canvas{:style => "width: 900px; height: 600px;"}

So, now there is just the name and the phone number, how can I display an additional link (or make the name of the business appear as a link)? The link itself is e.g. "http://localhost:3000/businesses/186-Cityname-businessname" (defined with to_param).

Thank you!

I have a map with multiple markers of panies using google maps API v3. I need to link from the infowindow to the pany show view of my application, so if I click on the marker an infowindow opens with some basic information and a link to view the details of the pany. The code is this:

class CitiesController < ApplicationController

...

def businessmap
    @city = City.find(params[:id])
    @mapcenter = @city.geocode
    @businesses = @city.businesses
    respond_to do |format|
      format.html
      format.json { render :json => @businesses.to_json(:only => [:id, :business_name, :phone, :latitude, :longitude]) }
    end
  end
end

The mapview itself is here:

%script{:type => "text/javascript", :charset => "utf-8", :src => "http://maps.googleapis./maps/api/js?v=3.6&sensor=false&region=IN"}
%script{:type => "text/javascript"}
  function initialize() {

  var cityLatlng = new google.maps.LatLng(
  = @mapcenter[0]
  ,
  = @mapcenter[1]
  );

  var options = {
  zoom: 13,
  center: cityLatlng,
  mapTypeId: google.maps.MapTypeId.ROADMAP
  };

  var map = new google.maps.Map(document.getElementById("map_canvas"), options);

  $.getJSON('businessmap.json', function(businesses) {
  $(businesses).each(function() {
  var business = this;
  var infowindow = new google.maps.InfoWindow({
  content: business.business_name + '<br/>' + 'Phone: ' + business.phone
  });
  var marker = new google.maps.Marker({
  position: new google.maps.LatLng(business.latitude, business.longitude),
  map: map,
  icon: image
  });
  google.maps.event.addListener(marker, 'click', function() {
  infowindow.open(map,marker);
  });
  });
  });
  }

%body{ :onload => "initialize()" }
  %div#map_canvas{:style => "width: 900px; height: 600px;"}

So, now there is just the name and the phone number, how can I display an additional link (or make the name of the business appear as a link)? The link itself is e.g. "http://localhost:3000/businesses/186-Cityname-businessname" (defined with to_param).

Thank you!

• javascript
• ruby-on-rails-3
• google-maps-api-3

Share Improve this question Follow asked Jan 2, 2012 at 14:28 user929062user929062 81744 gold badges1212 silver badges3333 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 6

The relavent code you're looking to modify is is the snippet below, where content is getting assigned to whatever will show up in the infowindow when it's clicked on.

var infowindow = new google.maps.InfoWindow({
  content: business.business_name + '<br/>' + 'Phone: ' + business.phone
});

The trick is going to be building the URL, since the JavaScript has no knowledge of Rails routes. You could change the controller's JSON rendering to include the URL perhaps adding :methods => [:to_param] (the better way) OR build a patible URL in javascript (the easy way) and hoping that whatever parses the URLs only uses the integers.

---

Easy Way

In the view -

var infowindow = new google.maps.InfoWindow({
  content: '<a href="/businesses/' + business.id + '">' + business.business_name + '</a><br/>' + 'Phone: ' + business.phone
});

---

Slightly Better Way

In the controller -

format.json { render :json => @businesses.to_json(:only => [:id, :business_name, :phone, :latitude, :longitude], :methods => [:to_param]) }

In the view -

var infowindow = new google.maps.InfoWindow({
  content: '<a href="/businesses/' + business.to_param + '">' + business.business_name + '</a><br/>' + 'Phone: ' + business.phone
});

You could use the links method in javascript: here is how you cold do it

var str = ( 8.8.8.8).toString().link("www.google.");
var infowindow = new google.maps.InfoWindow({
   content: str
 }); 

本文标签： javascriptDisplaying links in google maps infowindow for multiple markers using Rails 31Stack Overflow