Question

我正在使用带有gmaps4rails的rails 4，现在尝试在＆＃34; show＆＃34;上显示带有多边形的地图。查看我的一个模特。我认为我已经掌握了很多东西，因为在javascript中手动提供纬度和经度对于标记和多边形来说都很好。型号名称为＆＃34;数据集＆＃34;。它有四个坐标字段，表示数据集中包含的数据的地理边界框的坐标（：north_bounding_coordinate，east _... etc）。我需要处理它以将其转换为4个纬度经度值，以显示多边形形状。在我的数据集模型中，我尝试构建一个哈希，我可以转向json，在我的视图中传入javasript。然而，这似乎无法正常工作。

这里我的观点（数据集显示）：

.container
    %h3 Map
    %br
    .round-frame
      %div{style: "width: 800px;"}
        #map{style: "width: 800px; height: 400px;"}


  :javascript
   var handler = Gmaps.build('Google');
   handler.buildMap({ internal: {id: 'map'}}, function(){
     polygons = handler.addPolygons(=raw @bounding_box.to_json);
    handler.bounds.extendWith(polygons);
      handler.fitMapToBounds();
      handler.getMap().setZoom(12);
    });

这是我的控制器（数据集显示动作）：

def show
      @bounding_box = @dataset.get_coordinates
end

最后但并非最不重要的是数据集模型部分：

def get_coordinates
                  north_east = Gmaps4rails.build_markers(self) do |dataset, marker|
                          marker.lat dataset.north_bounding_coordinate
                          marker.lng dataset.east_bounding_coordinate
                  end
                  south_east = Gmaps4rails.build_markers(self) do |dataset, marker|
                          marker.lat dataset.north_bounding_coordinate
                          marker.lng dataset.east_bounding_coordinate
                  end
                  north_west = Gmaps4rails.build_markers(self) do |dataset, marker|
                          marker.lat dataset.north_bounding_coordinate
                          marker.lng dataset.west_bounding_coordinate
                  end
                  south_west = Gmaps4rails.build_markers(self) do |dataset, marker|
                          marker.lat dataset.north_bounding_coordinate
                          marker.lng dataset.west_bounding_coordinate
                  end
                  north_east + south_east + north_west + south_west
          end

地图没有显示任何内容。如果我在我的视图中检查哈希，就像我会把它放进去一样它看起来像这样的java脚本：

"[{\"lat\":29.285201,\"lng\":118.148346},{\"lat\":29.285201,\"lng\":118.148346},{\"lat\":29.285201,\"lng\":29.101777},{\"lat\":29.285201,\"lng\":29.101777}]"

也许它不起作用的原因是钥匙的奇怪逃避的事情？我怎样才能让它正常工作？欢迎任何建议或解决方案。

UPDATE（边界框的新模型方法）：

def get_coordinates
                [{"lat" => self.north_bounding_coordinate, "lng" => self.west_bounding_coordinate},
               {"lat" => self.south_bounding_coordinate, "lng" => self.west_bounding_coordinate},
                 {"lat" => self.south_bounding_coordinate, "lng" => self.east_bounding_coordinate},
                {"lat" => self.north_bounding_coordinate, "lng" => self.east_bounding_coordinate}]
          end

检查除了现在的coorinates之外，给出了相同的结果正确。当我手动创建一个带有多边形的地图时，这样可以正常工作：

:javascript
   var handler = Gmaps.build('Google');
     handler.buildMap({ internal: {id: 'map'}}, function(){
     var polygons = handler.addPolygons(
       [
         [
           {lat:  29.29139, lng: 118.0372}, { lat: 29.13833, lng: 118.0372},
           {lat:  29.13833, lng:118.18776}, { lat: 29.29139, lng:118.18776},
         ]
       ],
        {
        "strokeColor": "#FF0000",
        }
     );
     handler.bounds.extendWith(polygons);
     handler.fitMapToBounds();
     handler.getMap().setZoom(8);
   });

当我在手动示例中转义字符串时，就像as_json自动完成的那样，地图不再显示了。所以我怀疑这种逃避是问题，但我不知道如何解决这个问题。

我找到了一个解决方案，但我不知道这是不是一个好的解决方案。而不是使用：

polygons = handler.addPolygons(=raw @bounding_box.to_json);

我现在用

polygons = handler.addPolygons(#{@bounding_box.to_json});

它很好用。它不再逃避弦乐。

Answer 1

解决方案是使用：

#{@bounding_box.to_json}

而不是

=raw @bounding_box.to_json

使用gmaps4rails绘制多边形

1 个答案: