使用Rails 3.1在google地图信息窗口中显示多个标记的链接

Displaying links in google maps infowindow for multiple markers using Rails 3.1

本文关键字：显示 链接 窗口 信息窗 Rails google 信息 地图 使用      更新时间：2023-09-26

我有一个使用google maps API v3的公司的多个标记的地图。我需要从信息窗口链接到我的应用程序的公司显示视图，所以如果我点击标记一个信息窗口打开一些基本信息和链接，以查看公司的详细信息。代码如下:

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

mapview本身在这里:

%script{:type => "text/javascript", :charset => "utf-8", :src => "http://maps.googleapis.com/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;"}

那么，现在只有名称和电话号码，我如何显示一个额外的链接(或使企业的名称作为链接出现)?链接本身是例。"http://localhost:3000/businesses/186-Cityname-businessname"(由to_param定义)。

谢谢!

您要修改的相关代码是下面的代码片段，其中content被分配给点击时将显示在信息窗口中的任何内容。

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

技巧在于构建URL，因为JavaScript不知道Rails路由。你可以改变控制器的JSON渲染来包含URL，也许添加:methods => [:to_param] (更好的方法)或者在javascript中构建一个兼容的URL (简单的方法)，并希望任何解析URL只使用整数。

简单方法

view -

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

稍微好一点的方法

控制器- 

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

view -

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

你可以在javascript中使用links方法:你可以这样做

var str = ( 8.8.8.8).toString().link("www.google.com");
var infowindow = new google.maps.InfoWindow({
   content: str
 });
相关文章：