Рисуем полигон с помощью gmaps4rails

Я использую rails 4 с gmaps4rails и сейчас пытаюсь отобразить карту с многоугольником в представлении "показать" одной из моих моделей. Я думаю, что у меня есть почти все на месте, так как ручное предоставление широты и долготы в javascript прекрасно работает как для маркеров, так и для полигонов. Название модели - набор данных. Он имеет четыре поля координат, которые представляют координаты географической ограничительной рамки данных, которые содержатся в наборе данных (:north_bounding_coordinate, east_... и т. Д.). Мне нужно обработать это, чтобы превратить его в 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}]" 

Может быть, причина того, что это не сработало, в том, что эта странная экранирующая вещь для ключей? Как я могу заставить это работать должным образом? Любые предложения или решения приветствуются.

ОБНОВЛЕНИЕ (новый метод модели для ограничительной рамки):

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 

Проверка, которая дает, однако, те же результаты, за исключением координат, теперь верна. Когда я вручную создаю карту с помощью многоугольника, это работает очень хорошо:

: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});

И это работает хорошо. Это больше не ускользает от струн.

1 ответ

Решение

Решение заключается в использовании:

#{@bounding_box.to_json}

Вместо

=raw @bounding_box.to_json
Другие вопросы по тегам