google地图API简单标记 [英] google map API simple markers

问题描述

我有一个使用google map API的应用程式。我试图在地图上显示简单的标记。标记是我的数据库中的项目（包括纬度和经度值）。我可以在地图上显示一个标记，但我无法用数据库中的所有项目填充地图。

我只能调用数据库每个单独的项目。

我的帮助文件：

  def name（x）
 @name = Place.find（x）.name 
 return @name 
 end 
 
 def latitude（x）
 @latitude = Place.find（x）.latitude 
 return @latitude 
 end 
 
 def longitude（x）
 @longitude = Place.find（x）.longitude 
 return @longitude 
 end 
  

这是我为地图创建的变量： / p>

...

  var myLatlng = new google.maps.LatLng （<％= latitude（1）％>，<％= longitude（1）％>）
  

$ b b

...

  var marker1 = new google.maps.Marker（{
 position：myLatlng， 
 map：map，
 title：<％= name（1）％>
} 
  

...

解决方案

这是html.haml语法 - 在布局上初始化一个js数组，如

  window.markers = []; 
  

然后在您的检视页上 -

  @places = Place.all 
 @ places.each do | place | 
 #javascript code 
 $（document）.ready（function（）{
 window.markers.push（[new google.maps.LatLng（＃{place.latitude}，＃
 {place.longitude}），＃{place.name}]）; 
}）; 
 end 
  

视图上的js代码

  $。each（window.markers，function（i，e）{
 var marker = new google.maps.Marker（{
 position：e [ 0]，
 title：e [1]，
 map：map 
}）; 
}）; 
  

I have an application which uses the google map API. I am trying to display simple markers on the map. The markers are items in my database (including the latitude and the longitude values). I can display one marker on the map but I am not able to populate the map with all the items from the database.

I am only able to make calls to database to each individual item. Any suggestion would be appreciated.

My helper file:

def name(x)
    @name = Place.find(x).name
    return @name
end

def latitude(x)
    @latitude = Place.find(x).latitude
    return @latitude
end

def longitude(x)
    @longitude = Place.find(x).longitude
    return @longitude
end

This the variable I created for the map:

...

var myLatlng = new google.maps.LatLng(<%= latitude(1) %>, <%= longitude(1)%>)

...

            var marker1 = new google.maps.Marker({
                position: myLatlng,
                map: map,
                title: "<%= name(1) %>"
            });

...

解决方案

this is html.haml syntax-- initialize a js array on your layout like

window.markers = [];

then on your view page-

@places = Place.all
@places.each do |place|
#javascript code
  $(document).ready(function(){      
    window.markers.push([ new google.maps.LatLng(#{place.latitude},#
    {place.longitude}), "#{place.name}"]);
  });
end

js code on view

$.each(window.markers,function(i,e){
  var marker = new google.maps.Marker({
  position: e[0],
  title: e[1],            
  map: map
  });
});

这篇关于google地图API简单标记的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！