将google maps api v2转换为v3,在main.js中获取脚本错误

时间:2013-04-25 12:17:22

标签: google-maps-api-3

我正在将我的代码从版本2转换为版本3.我收到了脚本错误 http://maps.gstatic.com/intl/en_us/mapfiles/api-3/12/9/main.js 我在页面上的代码是

 <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true&key=<%=strGk%>"></script>
   <script type="text/javascript">
function initialize() {
            var myOptions = {
            zoom: 7,
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            center: "<%=strOrig%>",
            mapTypeControl: true,
            mapTypeControlOptions: {
                style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
                position: google.maps.ControlPosition.BOTTOM
            },
            navigationControl: true,
            navigationControlOptions: {
                style: google.maps.NavigationControlStyle.ZOOM_PAN,
                position: google.maps.ControlPosition.TOP_RIGHT
            },
            scaleControl: true,
            scaleControlOptions: {
                position: google.maps.ControlPosition.TOP_LEFT
            }
        }

        map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
        directionsDisplay.setMap(map);
        directionsDisplay.setPanel(document.getElementById("directions"));
        google.maps.event.addListener(directionsDisplay, "addoverlay", afterDir);
        google.maps.event.addListener(directionsDisplay, "error", handleErrors);
        //  geocoder = new GClientGeocoder();
        geocoder = new google.maps.Geocoder();    

1 个答案:

答案 0 :(得分:0)

您使用的是已弃用的导航控件

在V3中,它分为单独的Zoom和Pan控件。见documentation

<强> TRY

function initialize() {
  var mapOptions = {
    zoom: 7,
    center: new google.maps.LatLng(55.91913101970850, -4.650520),
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    mapTypeControl: true,
    mapTypeControlOptions: {
        style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
        position: google.maps.ControlPosition.BOTTOM
    },
    panControl: true,
    panControlOptions: {
        position: google.maps.ControlPosition.TOP_RIGHT
    },
    zoomControl: true,
    zoomControlOptions: {
        //style: google.maps.ZoomControlStyle.LARGE,
        position: google.maps.ControlPosition.TOP_RIGHT
    },
    scaleControl: true,
    scaleControlOptions: {
        position: google.maps.ControlPosition.TOP_LEFT
    },
  }
  var map = new google.maps.Map(document.getElementById('map_canvas'),
                                mapOptions);
}