他のブラウザでは問題なく動作しているにもかかわらず、Internet Explorer ではマーカーが表示されないようです。
IEで実行すると、デバッグしてエラーが発生します。「行: 173 エラー: 'console' は定義されていません」
<script type='text/javascript'>
var markerList = new Array();
var propertyList = new Array();
var itemDisplayList = new Array();
var geocoder;
var map;
var latLng;
var browserSupportFlag = new Boolean();
var yaml;
var currentWindow = null;
var addr = "Kansas, KA"
function initialize() {
newMap();
showAllProperties();
<% @yaml = YAML.load(File.read("config/property.yml")) %>
<%
addr = []
name = []
link = []
contact = []
@yaml.each do |property|
prop = Property.new(property)
addr << prop.format_address
contact << prop.format_contact_info
name << prop.property
link << prop.link
end
%>
var addresses = <%= addr.to_json %>;
var names = <%= name.to_json %>;
var contacts = <%= contact.to_json %>;
var links = <%= link.to_json %>;
var i = 0;
function slow_addMarker(){
if(i < addresses.length){
var propertyObj = {address: addresses[i], name: names[i], link: links[i], contact: contacts[i]};
propertyList.push(propertyObj);
addMarker(propertyObj, i);
i++;
if (i < addresses.length){
timeout = setTimeout(slow_addMarker,500);
}
}
}
slow_addMarker();
/*
for(var i = 0; i < addresses.length; i++)
{
var propertyObj = {address: addresses[i], name: names[i], link: links[i], contact: contacts[i]};
propertyList.push(propertyObj);
addMarker(propertyObj, i); //We need to specify the id or else items can be populated in the wrong order due to difference in API call timing
}
*/
itemDisplayList = $('.locations li');
}
function newMap()
{
geocoder = new google.maps.Geocoder();
var myOptions = {
zoom: 4,
mapTypeId: google.maps.MapTypeId.HYBRID
}; //end of my options
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
geocoder.geocode({'address': addr}, function(results, status)
{
if(status == google.maps.GeocoderStatus.OK)
{
latLng = results[0].geometry.location;
map.setCenter(latLng);
// var marker = new google.maps.Marker(
// {
// // map: map,
// position: latLng
// // icon: "/images/common/gmap_blue_icon.png",
// // shadow: "/images/common/shadow50.png"
// });
// google.maps.event.addListener(marker, 'click', function()
// {
// if (currentWindow != null)
// {
// currentWindow.close();
// }
// infoWindowHere.open(map,marker);
// currentWindow = infoWindowHere;
// });
}
else
{
alert("Geocode was not successful for the following reason: " + status);
latLng = new google.maps.LatLng(0.0, 0.0);
}
});
}
function handleNoGeolocation(errorFlag)
{
if(errorFlag == true)
{
alert("Geolocation service failed.");
geocoder.geocode( { 'address': "<%= Property.new(YAML.load(File.read("config/property.yml"))[0]).format_address%>"}, function(results, status)
{
if (status == google.maps.GeocoderStatus.OK)
{
map.setCenter(results[0].geometry.location);
}
else
{
alert("Geocode was not successful for the following reason: " + status);
}
});
}
else
{
alert("Your browser doesn't support geolocation.");
geocoder.geocode( { 'address': "<%= Property.new(YAML.load(File.read("config/property.yml"))[0]).format_address%>"}, function(results, status)
{
if (status == google.maps.GeocoderStatus.OK)
{
map.setCenter(results[0].geometry.location);
}
else
{
alert("Geocode was not successful for the following reason: " + status);
}
});
}
}
function addInfoWindow(propertyObject)
{
var contentStr =''+
'<div id="siteNotice">'+
'<h2>'+ propertyObject.name +'</h2>'+
'<p>'+ propertyObject.address +'</p>'+
'<p>'+ propertyObject.contact +'</p>'+
'<a class="goto" href="'+ propertyObject.link + '">View Details</a>'+
'</div>';
var infoWindow = new google.maps.InfoWindow(
{
map: map,
content: contentStr
});
return infoWindow
}
function addMarker(propertyObject, id)
{
var wait_time = 200 * id;
setTimeout(function(){
geocoder.geocode({'address': propertyObject.address}, function(results, status)
{
if(status == google.maps.GeocoderStatus.OK)
{
var marker = new google.maps.Marker(
{
map: map,
position: results[0].geometry.location
});
markerList[id] = marker;
// google.maps.event.addListener(marker, 'click', function()
// {
// if (currentWindow != null)
// {
// currentWindow.close();
// }
// var infoWindow = addInfoWindow(propertyObject);
// infoWindow.open(map,marker);
// currentWindow = infoWindow;
//
// });
}
else
{
//alert("Geocode was not successful for the following reason: " + status);
if (status = google.maps.GeocoderStatus.OVER_QUERY_LIMIT) {
setTimeout(function(){addMarker(propertyObject, id)}, 600); //try to reload it a bit later
}
}
});
}, wait_time);
}
function hideAllMarkers()
{
for( var i = 0; i < markerList.length; i++)
{
markerList[i].setVisible(false);
}
}
function openWindow(map, marker)
{
// // if currentWindow != null
// // google.maps.event.trigger(currentWindow, 'closeclick');
// var infoWindow = addInfoWindow(propertyObject);
// infoWindow.open(map,marker);
// currentWindow = infoWindow;
}
function showAllProperties()
{
for(var i = 0; i < propertyList.length; i++)
{
markerList[i].setVisible(true);
$(itemDisplayList[i]).show('slow');
}
}
function showOneCity(city)
{
for(var i = 0; i < propertyList.length; i++)
{
if(propertyList[i].address.search(city) != -1)
{
markerList[i].setVisible(true);
$(itemDisplayList[i]).show('slow');
}
else
{
markerList[i].setVisible(false);
$(itemDisplayList[i]).hide('slow');
}
}
}
function showOneProperty(property)
{
for(var i = 0; i < propertyList.length; i++)
{
// alert(propertyList[i].name + " " + property)
if(propertyList[i].name == property)
markerList[i].setVisible(true);
else
markerList[i].setVisible(false);
}
}
</script>