初めて質問させていただきます。
現在Webサイト作成の中でGoogle Maps Apiにて地図を編集しているのですが、
完成後にブラウザで確認するとSafariブラウザで開いたときのみグリッド線がマーカー画像の上に白く薄い線で表示されます。
この不具合を解消する方法をご存じの方がいらっしゃったら、
ぜひ教えていただけますでしょうか。
<script type="text/javascript">
function initialize() {
var latlng = new google.maps.LatLng(13.7585881,100.6346714);
var myOptions = {
zoom: 15,
center: latlng,
mapTypeControlOptions: { mapTypeIds: ['sample', google.maps.MapTypeId.ROADMAP] }/};
var map = new google.maps.Map(document.getElementById('map_canvas'), myOptions);
/*アイコン設定▼*/
var icon = new google.maps.MarkerImage('../img/logo_map.png',
new google.maps.Size(40,40),/*アイコンサイズ*/
new google.maps.Point(0,0)/*アイコン位置*/
);
var markerOptions = {
position: latlng,
map: map,
icon: icon,
title: "SiamSynergySolutions"
};
var marker = new google.maps.Marker(markerOptions);
/*アイコン設定▲*/
/*スタイル*/
var styleOptions = [{"featureType":"landscape","elementType":"all","stylers":[{"hue":"#6600ff"},{"saturation":-11}]},{"featureType":"poi","elementType":"all","stylers":[{"saturation":-78},{"hue":"#6600ff"},{"lightness":-47},{"visibility":"off"}]},{"featureType":"road","elementType":"all","stylers":[{"hue":"#5e00ff"},{"saturation":-79}]},{"featureType":"road.local","elementType":"all","stylers":[{"lightness":30},{"weight":1.3}]},{"featureType":"transit","elementType":"all","stylers":[{"visibility":"simplified"},{"hue":"#5e00ff"},{"saturation":-16}]},{"featureType":"transit.line","elementType":"all","stylers":[{"saturation":-72}]},{"featureType":"water","elementType":"all","stylers":[{"saturation":-65},{"hue":"#1900ff"},{"lightness":8}]}];
var styledMapOptions = { name: 'SiamSynergySolutions' }
var sampleType = new google.maps.StyledMapType(styleOptions, styledMapOptions);
map.mapTypes.set('sample', sampleType);
map.setMapTypeId('sample');
}
google.maps.event.addDomListener(window, 'load', initialize);
google.maps.getOptions().setGridVisibility(false);
</script>
地図部分のjsコードはこのような状態です。
それではよろしくお願いいたします。