The markers linked to my geoJSON are not showing up on the map. When I test my geoJSON on , it works perfectly. However, if I replace my geoJSON with a sample from the Google Maps Dev API
'https://storage.googleapis.com/maps-devrel/google.json'
, the overlay displays correctly on my map.
Below, I am using
http://localhost:3009/murals.json
as the argument for the loadGeoJson
function. I have also tried using test.json
from a local file.
Code in my map .js file:
function initialize() {
var myLatlng = new google.maps.LatLng(40.0172679,-105.2839094);
var myOptions = {
zoom: 16,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(
document.getElementById('map'), myOptions
);
map.data.loadGeoJson('http://localhost:3009/murals.json');
};
google.maps.event.addDomListener(window, "load", initialize());
My controller (potentially needs refactoring, but correctly outputs formatted geoJSON):
def index
@murals = Mural.all
muralHash = []
@geojson = { type: "GeometryCollection",
geometries: muralHash
}
@murals.each do |mural, myHash = {:type => nil,:coordinates => nil}|
myHash["type"] = 'Point'
myHash["coordinates"] = [mural.longitude, mural.latitude]
muralHash << myHash
end
respond_to do |format|
format.html
format.json { render json: @geojson }
end
end
Sample of geoJSON data:
{ "type":"GeometryCollection",
"geometries":[
{
"type":"Point",
"coordinates":[-105.287685950293,40.0124034482671]
},
{
"type":"Point",
"coordinates":[-105.196297724738,39.9935339839196]
},
{
"type":"Point",
"coordinates":[-105.283136923804,40.0162490232761]
}
]
}