Google maps 谷歌地图地理编码不起作用

我正在尝试使用Google Maps API对以下地址进行地理编码-->Noguera 429 San Antonio de Padua。地址来自数据库，存储在变量地址中。这是我的代码：

var address = '<?php echo $cerrajero["direccion"]?>'+' '+'<?php echo $cerrajero["ciudad"]?>';
var myCenter;

function initialize(){

    var geocoder = new google.maps.Geocoder();

    geocoder.geocode({
        "address": address
    },function(results){
         myCenter = results[0].geometry.location;
    });

    var mapProp = {
        center:myCenter,
        zoom: 15,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    var map=new google.maps.Map(document.getElementById("googleMap"), mapProp);

    var marker=new google.maps.Marker({
        position:myCenter,
        icon:'css/images/pin.png'
    });

    marker.setMap(map);
}

google.maps.event.addDomListener(window, 'load', initialize);

但是我的地图没有显示出来。它只是显示了一个灰色块，javascript有什么问题吗

---

PS：变量地址正常，我用控制台检查过。

地理编码器是异步的，您必须在回调函数中使用可用的结果

代码片段：

var地址='Noguera 429 San Antonio de Padua'；
菌丝中心变种；
函数初始化（）{
var geocoder=new google.maps.geocoder（）；
地理编码({
“地址”：地址
}，功能（结果、状态）{
if（status==google.maps.GeocoderStatus.OK）{
myCenter=results[0]。geometry.location；
var mapProp={
中心：迈森特，
缩放：15，
mapTypeId:google.maps.mapTypeId.ROADMAP
};
var map=new google.maps.map（document.getElementById（“googleMap”），mapProp）；
var marker=new google.maps.marker({
职位：迈森特，
//图标：“css/images/pin.png”
});
marker.setMap（map）；
}否则{
警报（'地理编码因以下原因未成功：'+状态）；
}
});
}
google.maps.event.addDomListener（窗口“加载”，初始化）
html，
身体，
#谷歌地图{
身高：100%；
宽度：100%；
边际：0px；
填充：0px
}
地理编码器是异步的，您必须在回调函数中使用可用的结果

代码片段：


var地址='Noguera 429 San Antonio de Padua'；
菌丝中心变种；
函数初始化（）{
var geocoder=new google.maps.geocoder（）；
地理编码({
“地址”：地址
}，功能（结果、状态）{
if（status==google.maps.GeocoderStatus.OK）{
myCenter=results[0]。geometry.location；
var mapProp={
中心：迈森特，
缩放：15，
mapTypeId:google.maps.mapTypeId.ROADMAP
};
var map=new google.maps.map（document.getElementById（“googleMap”），mapProp）；
var marker=new google.maps.marker({
职位：迈森特，
//图标：“css/images/pin.png”
});
marker.setMap（map）；
}否则{
警报（'地理编码因以下原因未成功：'+状态）；
}
});
}
google.maps.event.addDomListener（窗口“加载”，初始化）
html，
身体，
#谷歌地图{
身高：100%；
宽度：100%；
边际：0px；
填充：0px
}


<div id="googleMap" class="map" style="height:250px;"></div>

.map{
    margin: 0 0 18px 0;
    width: 100%;
}