gmaps4rails - 将标记放到新位置 [英] gmaps4rails - drop marker to new position
问题描述
我有应用程序,可以从带有 GPS 数据的照片中提取 GPS 信息.当我想通过编辑操作更新位置时,我想拖动一个标记,替换它并保存新位置.当我点击地图时,旧标记仍然存在,所以有两个标记.第一个是旧的,第二个是新的,可拖动.我在 javascript 中更新了表单 ID,但未保存新位置.当我在 javascript 中检查数组的长度时,那里什么也没有.但是如果我看到页面的来源,数组中的标记很少.我错过了什么吗?
谢谢
properites_controller.rb
def 编辑@property = Property.find(params[:id])@json = Property.find(params[:id]).to_gmaps4rails结尾定义更新@property = Property.find(params[:id])如果@property.update_attributes(params[:property])redirect_to @property,注意:'属性已成功更新.'别的渲染动作:编辑"结尾结尾
edit.html.erb
<%= render 'form' %><div id="map_canvas"><%= gmaps("map_options" => { "zoom" => 15, "auto_adjust" => true, "auto_zoom" => false},标记" =>{数据"=>@json}) %>
<% content_for :scripts do %><script type="text/javascript" charset="utf-8">var 标记数组 = [];//单击时,清除标记,放置一个新标记,更新表单中的坐标Gmaps.map.callback = function() {google.maps.event.addListener(Gmaps.map.serviceObject, 'click', function(event) {clearOverlays();placeMarker(event.latLng);updateFormLocation(event.latLng);});};//用给定的坐标更新表单属性函数 updateFormLocation(latLng) {$('#property_latitude').val(latLng.lat());$('#property_longitude').val(latLng.lng());$('#property_gmaps_zoom').val(Gmaps.map.serviceObject.getZoom());}//添加一个带有打开信息窗口的标记函数 placeMarker(latLng) {var 标记 = 新的 google.maps.Marker({位置:纬度,地图:Gmaps.map.serviceObject,可拖动:真});markerArray.push(marker);//设置并打开信息窗口var infowindow = new google.maps.InfoWindow({content: '<div class="popup"><h2>Awesome!</h2><p>拖动我并调整缩放级别.</p>'});infowindow.open(Gmaps.map.serviceObject,marker);//听拖拽降低google.maps.event.addListener(marker, 'dragend', function() {updateFormLocation(this.getPosition());});}//从地图中移除叠加层函数 clearOverlays() {如果(标记数组){for (var i = 0; i _form.html.erb<%= simple_form_for @property, :html =>{:multipart =>真} 做 |f|%><%= f.error_notification %><div class="form-inputs"><%= f.input :name, :label =>"Název", :input_html =>{ :class =>输入-xlarge"} %><%= f.input :description, :label =>"Popis", :input_html =>{ :class =>"input-xlarge", :rows =>"6"}%><br/><%= f.hidden_field :纬度%><%= f.hidden_field :longitude %><%= f.input :date, :label =>"基准", :as =>:日期%><%= f.file_field :photo %>
<div class="form-actions"><%= link_to 'Zpět', properties_path, :class =>'btn'%><%= f.button :submit, :class =>'btn-主要'%>
<%结束%>
您使用的 markersArray
不是由 gem 的 javascript 维护的.
您应该简单地使用 Gmaps.map.markers
,它包含所有标记信息.
I have application where gps info are extracted from photo with gps data. When I want to update position by edit action, I would like to drag a marker, replace it and save new position. When I click to map, old marker is still there, so there are two markers. First is old and second is new one, dragable. I update form ids in javascript but new position is not saved. When I check length of array in javascript, then there is nothing there. But if I see source of page, there are few markers in array. Am I missing something?
Thank you
properites_controller.rb
def edit
@property = Property.find(params[:id])
@json = Property.find(params[:id]).to_gmaps4rails
end
def update
@property = Property.find(params[:id])
if @property.update_attributes(params[:property])
redirect_to @property, notice: 'Property was successfully updated.'
else
render action: "edit"
end
end
edit.html.erb
<%= render 'form' %>
<div id="map_canvas">
<%= gmaps("map_options" => { "zoom" => 15, "auto_adjust" => true, "auto_zoom" => false},
"markers" => {"data" => @json}) %>
</div>
<% content_for :scripts do %>
<script type="text/javascript" charset="utf-8">
var markersArray = [];
// On click, clear markers, place a new one, update coordinates in the form
Gmaps.map.callback = function() {
google.maps.event.addListener(Gmaps.map.serviceObject, 'click', function(event) {
clearOverlays();
placeMarker(event.latLng);
updateFormLocation(event.latLng);
});
};
// Update form attributes with given coordinates
function updateFormLocation(latLng) {
$('#property_latitude').val(latLng.lat());
$('#property_longitude').val(latLng.lng());
$('#property_gmaps_zoom').val(Gmaps.map.serviceObject.getZoom());
}
// Add a marker with an open infowindow
function placeMarker(latLng) {
var marker = new google.maps.Marker({
position: latLng,
map: Gmaps.map.serviceObject,
draggable: true
});
markersArray.push(marker);
// Set and open infowindow
var infowindow = new google.maps.InfoWindow({
content: '<div class="popup"><h2>Awesome!</h2><p>Drag me and adjust the zoom level.</p>'
});
infowindow.open(Gmaps.map.serviceObject,marker);
// Listen to drag & drop
google.maps.event.addListener(marker, 'dragend', function() {
updateFormLocation(this.getPosition());
});
}
// Removes the overlays from the map
function clearOverlays() {
if (markersArray) {
for (var i = 0; i < markersArray.length; i++ ) {
markersArray[i].serviceObject.setMap(null);
//markersArray[i].setMap(null);
}
}
markersArray.length = 0;
}
</script><% end %>
_form.html.erb
<%= simple_form_for @property, :html => {:multipart => true} do |f| %>
<%= f.error_notification %>
<div class="form-inputs">
<%= f.input :name, :label => "Název", :input_html => { :class => "input-xlarge"} %>
<%= f.input :description, :label => "Popis", :input_html => { :class => "input-xlarge", :rows => "6"} %><br />
<%= f.hidden_field :latitude %>
<%= f.hidden_field :longitude %>
<%= f.input :date, :label => "Datum", :as => :date %>
<%= f.file_field :photo %>
</div>
<div class="form-actions">
<%= link_to 'Zpět', properties_path, :class => 'btn' %>
<%= f.button :submit, :class => 'btn-primary' %>
</div>
<% end %>
You're using a markersArray
not maintained by the gem's javascript.
You should simply use Gmaps.map.markers
, it contains all markers information.
这篇关于gmaps4rails - 将标记放到新位置的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!