谷歌地图API简单标记

时间:2015-10-29 16:12:48

标签: ruby-on-rails database google-maps google-maps-markers

我有一个使用谷歌地图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

这是我为地图创建的变量:

...

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

...

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

...

1 个答案:

答案 0 :(得分:1)

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

Post OUR URL
Content-Type: application/pdf
Host: www.MyTestServices.com
Content-Length: 287549
Expect: 100-continue

%PDF-1.6
%    
4 0 obj
<</Length 1261
/Filter /FlateDecode
>>
stream
x  WKs5 `'&&cCx  GqbY z T b  T  b     kifwF  680c ZR   } R ) 'fV \ 7   Tde  N f  |  3 'Y 8\1  R?  GJ * ?k9 i S 5{} 1R B?  eC9  ?_ Z\ ~   }
   J 8iV "m 7  S10l   iz  (& 9 r c _    gR  Z  e ? ^}?68s w M  ]
W +  5gS y   M    
      :/T  ~   [c;v i   
     I N        V  2   E "  {yQrG  ev  Zr    *k&SM {   S Iz
H  k `   _($gm^ M  
,^:   .wL h h?  
 ' G   ?  ¸ _e !?  d[ 7  } Uw  >  / d g~   c khS
a b !5    p  ? ? s 5 ?1  x1jXiF  = Y  $z` ltj?  j,  ;0? \ z    *+  Q5 Z [v5?v  u?   gC    1i .fz    2e    2/g   ^  /M f3P   ,    M F %  "   n" }.  U * |k  z    3 Z  sW   '?    3   7E '  Z?   p9,  T** x 
 $  
  9  5_ dl =   =6w  xd9 y?y    4g {f0 ( v   r    gO  Z  : l  GM n  SR\ {  S   H  e0? f?q  E7 :g e *U?  n Hj N( _fh>@U   jr ar6HN  <z)K I _    3s?  E #? uS3YyYb Z  t)+ J    L d < ) qw `H       D *H    t N  l ? (  ,  *} /  B   ) \H K      p
/  H    
.  c    ^=Z  :.  ??,m(  &  j Z^   ?Vc 9O      6B    A   Lf` 3    |      ,g   c$5s  =  È    )v   
k0 
 C  ?6 I     A_-I4 .     = 9  7  R 1]« w    \ 7X )h .  -  J , ;q   g3  7  _8 ?k      o  E   2\ $X   @ $  e e6YI6   =  +  h    û x h  e3c6     o>+  >  h4  w8 7     f   'A ?5 U@@   _  e: g2W   ` ]   W * 7  X0E o    {w   89\  a e lr <  c s      H3 Ng  - rI  \F 5          `vk-Y  ;%  (? H +    ?]   I F T a sb ] a o< ? qa Qƒ7  `  [ ?z 1J g   fJk 0 e  ED   ] V w  R  hV3  |  ~  E27 jx    M  9! " L0 3 O$ 3     . a _* 
 q ?
endstream
endobj
65 0 obj
<</Type /FontDescriptor
/StemV 80
/FontName /FAAABI+Tahoma-Bold
/ItalicAngle 0
/Descent -206
/Ascent 1000
/CapHeight 727
/Flags 262176
/FontFile2 66 0 R
/FontBBox [-697 -215 1625 1066]
>>
endobj
64 0 obj
<</FontDescriptor 65 0 R
/W [2 [292] 20 [342] 4 [636] 3 [636] 1 [684] 18 [726] 5 [633] 12 [738] 16 [670] 8 [598] 15 [629] 10 [593] 14 [629] 17 [617] 13 [629] 6 [629] 9 [433] 11 [514] 19 [415] 7 [640]]
/Type /Font
/CIDSystemInfo <</Registry (Adobe)
/Supplement 0
/Ordering (Identity)
>>
/BaseFont /FAAABI+Tahoma-Bold
/Subtype /CIDFontType2
/CIDToGIDMap /Identity
/DW 1000
>>
endobj
68 0 obj
<</Length 325
/Filter /FlateDecode
>>
stream
x ] ?    &   Ql ?1  m a d >   %Y  =  
#4 r       O  $ zd
    5L M3 W?#J  a
      y20?  p ? ' g :  
O6 Cs B d ]5n  ) 
HC 8*K¡s  Z  @  kn#     / 2+ ?A [  äZ  =? v   e   7^;   G #Z yK=e      & E
Z ( x 9*B )   h =j!    Z Y  A; NE_ ?]    {  v Z    t     ety  ` M ? nZ ~ W >         F >?     
endstream
endobj
63 0 obj
<</BaseFont /FAAABI+Tahoma-Bold
/Type /Font
/Encoding /Identity-H
/DescendantFonts [64 0 R]
/ToUnicode 68 0 R
/Subtype /Type0
>>
endobj
23 0 obj
<</Type /Page
/Contents 24 0 R
/Resources <</XObject <</X4 40 0 R
/X3 41 0 R
/X2 42 0 R
/X1 44 0 R
>>
/Font <</FAAAAI 45 0 R
/FAAABD 51 0 R
/FAAAEA 57 0 R
/FAAABI 63 0 R
>>
>>
/MediaBox [0 0 612 792]
/Annots [25 0 R 26 0 R 27 0 R 28 0 R 29 0 R 30 0 R 31 0 R 32 0 R 33 0 R 34 0 R 35 0 R 36 0 R 37 0 R 38 0 R 39 0 R]
/Parent 1 0 R
>>
endobj
1 0 obj
<</Type /Pages
/Kids [3 0 R 23 0 R]
/Count 2
>>
endobj
69 0 obj
<</Pages 1 0 R
/Type /Catalog
>>
endobj
70 0 obj
<</Title <>
/Keywords <>
/Creator <4561676c655669657720546563686e6f6c6f67696573>
/Producer (Aspose.Pdf.Kit for .NET 5.2.0.0)
/CreationDate (D:20150608105840-07'00')
/Author <>
/Subject <>
/ModDate <443a32303133303931373232343830305a>
>>
endobj
xref
0 71
0000000000 65535 f 
0000285683 00000 n 
0000000000 00000 n 
0000134214 00000 n 
0000000015 00000 n 
0000001348 00000 n 
0000001397 00000 n 
0000001446 00000 n 
0000001495 00000 n 
0000001544 00000 n 
0000001593 00000 n 
0000001643 00000 n 
0000017191 00000 n 
0000015964 00000 n 
0000015769 00000 n 
0000001715 00000 n 
0000001693 00000 n 
0000016650 00000 n 
0000017336 00000 n 
0000094661 00000 n 
0000127689 00000 n 
0000120474 00000 n 
0000000000 00000 n 
0000285335 00000 n 
0000134541 00000 n 
0000138945 00000 n 
0000139158 00000 n 
0000139432 00000 n 
0000139714 00000 n 
0000139997 00000 n 
0000140282 00000 n 
0000140567 00000 n 
0000140841 00000 n 
0000141124 00000 n 
0000141407 00000 n 
0000141690 00000 n 
0000141973 00000 n 
0000142256 00000 n 
0000142540 00000 n 
0000142823 00000 n 
0000143108 00000 n 
0000177824 00000 n 
0000190372 00000 n 
0000188808 00000 n 
0000197575 00000 n 
0000264008 00000 n 
0000262570 00000 n 
0000262375 00000 n 
0000244819 00000 n 
0000244797 00000 n 
0000263396 00000 n 
0000273650 00000 n 
0000272970 00000 n 
0000272776 00000 n 
0000264169 00000 n 
0000264148 00000 n 
0000273292 00000 n 
0000277854 00000 n 
0000277302 00000 n 
0000277110 00000 n 
0000273812 00000 n 
0000273791 00000 n 
0000277542 00000 n 
0000285190 00000 n 
0000284403 00000 n 
0000284199 00000 n 
0000278017 00000 n 
0000277996 00000 n 
0000284793 00000 n 
0000285746 00000 n 
0000285795 00000 n 
trailer
<</Size 71
/Info 70 0 R
/Root 69 0 R
>>
startxref
286048
%%EOF

然后在您的视图页面 -

window.markers = [];

js代码视图

@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