2012-01-02 10 views
1

GoogleマップAPI v3を使用している企業のマーカーが複数あるマップがあります。 infowindowから私のアプリケーションの会社のショービューにリンクする必要があるので、マーカーをクリックするとinfowindowが開き、いくつかの基本情報とリンクが表示され、会社の詳細が表示されます。コードはこれです:Googleマップにリンクを表示するRails 3.1を使用して複数のマーカーを表示するinfowindow

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で定義)。

ありがとうございました!

答えて

3

あなたが修正しようとしているrelaventコードは、以下のスニペットです。ここでcontentはクリックされたときにインフォウィンドウに表示されるものに割り当てられます。

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

JavaScriptはRailsルートを知らないので、このトリックはURLを構築することになります。コントローラーのJSON renderingにURLを追加して、おそらく:methods => [:to_param](良い方法)を追加することができます。または互換性のあるURLをjavadript (簡単な方法)に作成し、URLの解析には整数のみを使用します。


簡単な方法を考慮して

-


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]) } 

-

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

非常に明確で正しい答えを行うコールド方法です。どうもありがとう!! – user929062

0

あなたはjavascript内のリンクの方法を使用することができます。ここ は、あなたがそれを

var str = (8.8.8.8).toString().link("www.google.com"); 
var infowindow = new google.maps.InfoWindow({ 
    content: str 
}); 
関連する問題