谷歌地图标记不显示

时间:2015-03-24 05:21:10

标签: javascript google-maps google-maps-api-3

我最近在我的网站上添加了一张谷歌地图。但它没有显示地图标记。我在这里使用谷歌地图的自定义颜色样式 我的网站链接:

  

http://clavisc.com/contact/

我编码如下:

<script>
window.onload = function () {  
var styles = [  
 {
    "featureType": "landscape",
    "stylers": [
        {
            "saturation": -100
        },
        {
            "lightness": 65
        },
        {
            "visibility": "on"
        }
    ]
},
{
    "featureType": "poi",
    "stylers": [
        {
            "saturation": -100
        },
        {
            "lightness": 51
        },
        {
            "visibility": "simplified"
        }
    ]
},
{
    "featureType": "road.highway",
    "stylers": [
        {
            "saturation": -100
        },
        {
            "visibility": "simplified"
        }
    ]
},
{
    "featureType": "road.arterial",
    "stylers": [
        {
            "saturation": -100
        },
        {
            "lightness": 30
        },
        {
            "visibility": "on"
        }
    ]
},
{
    "featureType": "road.local",
    "stylers": [
        {
            "saturation": -100
        },
        {
            "lightness": 40
        },
        {
            "visibility": "on"
        }
    ]
},
{
    "featureType": "transit",
    "stylers": [
        {
            "saturation": -100
        },
        {
            "visibility": "simplified"
        }
    ]
},
{
    "featureType": "administrative.province",
    "stylers": [
        {
            "visibility": "off"
        }
    ]
},
{
    "featureType": "water",
    "elementType": "labels",
    "stylers": [
        {
            "visibility": "on"
        },
        {
            "lightness": -25
        },
        {
            "saturation": -100
        }
    ]
},
{
    "featureType": "water",
    "elementType": "geometry",
    "stylers": [
        {
            "hue": "#ffff00"
        },
        {
            "lightness": -25
        },
        {
            "saturation": -97
        }
    ]
}
];  
var options = {  
mapTypeControlOptions: {  
    mapTypeIds: ['Styled']  
},  
    center: new google.maps.LatLng(55.681527, 12.591067),  
    zoom: 14,  
    disableDefaultUI: true,   
    mapTypeId: 'Styled'  
};  
var div = document.getElementById('gmap');  
var map = new google.maps.Map(div, options);  
var styledMapType = new google.maps.StyledMapType(styles, { name: 'Styled' });  
map.mapTypes.set('Styled', styledMapType);  

};  

1 个答案:

答案 0 :(得分:0)

我认为函数调用存在一些问题,你可以尝试这个并让我知道。

 <script type="text/javascript" src="https://maps.google.com/maps/api/js?sensor=false"></script>

<script>
window.onload=function(){    var styles = [  
 {
    "featureType": "landscape",
    "stylers": [
        {
            "saturation": -100
        },
        {
            "lightness": 65
        },
        {
            "visibility": "on"
        }
    ]
},
{
    "featureType": "poi",
    "stylers": [
        {
            "saturation": -100
        },
        {
            "lightness": 51
        },
        {
            "visibility": "simplified"
        }
    ]
},
{
    "featureType": "road.highway",
    "stylers": [
        {
            "saturation": -100
        },
        {
            "visibility": "simplified"
        }
    ]
},
{
    "featureType": "road.arterial",
    "stylers": [
        {
            "saturation": -100
        },
        {
            "lightness": 30
        },
        {
            "visibility": "on"
        }
    ]
},
{
    "featureType": "road.local",
    "stylers": [
        {
            "saturation": -100
        },
        {
            "lightness": 40
        },
        {
            "visibility": "on"
        }
    ]
},
{
    "featureType": "transit",
    "stylers": [
        {
            "saturation": -100
        },
        {
            "visibility": "simplified"
        }
    ]
},
{
    "featureType": "administrative.province",
    "stylers": [
        {
            "visibility": "off"
        }
    ]
},
{
    "featureType": "water",
    "elementType": "labels",
    "stylers": [
        {
            "visibility": "on"
        },
        {
            "lightness": -25
        },
        {
            "saturation": -100
        }
    ]
},
{
    "featureType": "water",
    "elementType": "geometry",
    "stylers": [
        {
            "hue": "#ffff00"
        },
        {
            "lightness": -25
        },
        {
            "saturation": -97
        }
    ]
}
];  
var options = {  
mapTypeControlOptions: {  
    mapTypeIds: ['Styled']  
},  
    center: new google.maps.LatLng(55.681527, 12.591067),  
    zoom: 14,  
    disableDefaultUI: true,   
    mapTypeId: 'Styled'  
};  
var div = document.getElementById('gmap');  
var map = new google.maps.Map(div, options);  
var styledMapType = new google.maps.StyledMapType(styles, { name: 'Styled' });  
map.mapTypes.set('Styled', styledMapType);  
var markers=new google.maps.Marker({
                                position:new google.maps.LatLng(55.681527, 12.591067),
                                map:map,
                                title:'Clavis Capital',
                                  });

}
</script>

enter image description here