2风格的地图在谷歌地图api v3

2 styled map in Google maps api v3?

本文关键字：谷歌地图 api v3 地图 风格      更新时间：2023-09-26

首先，我是法国人，我的英语很差....

我会有2 style地图在我的网站:我的代码是:

    <script type="text/javascript">
        // Detection du navigateur utilisé, ainsi que l'affichage  
        <?php include("browser.js");?>
        // Début de la création de la map
        function initialiser() {
            <?php include("cartes.js");?>
            var Night = new google.maps.StyledMapType(Nuit,{name: "Nuit"});
            var Map = new google.maps.StyledMapType(Plan,{name: "Plan"});

            // Propriétés des identificateurs prédéfinis permettant de définir des options d'affichage
            var options = {
                center: new google.maps.LatLng(49.894524, 2.30195),
                zoom: 13,
                mapTypeControlOptions: {
                    mapTypeIds: [google.maps.MapTypeId.Plan, 'map_style1', 'map_style2', ]
                }
            };
            // Constructeur de la carte dans lequel la carte doit s'afficher ainsi que les options
            var carte = new google.maps.Map(document.getElementById("carte"), options);
            carte.mapTypes.set('map_style2', Night);
            carte.setMapTypeId('map_style2');               
            carte.mapTypes.set('map_style1', Map);
            carte.setMapTypeId('map_style1');

            <?php include("geolocalisation.js");?>
            <?php include("voitures.js");?>
        }

但问题是，2风格的地图在那里，但不是所有的时间工作…也许这是这个api的极限?

最可能的问题是:

mapTypeControlOptions: {
    mapTypeIds: [google.maps.MapTypeId.Plan, 'map_style1', 'map_style2', ]
}

已知的maptypeid是:HYBRID, ROADMAP, SATELLITE和TERRAIN。你有Plan

你可以把它改成:

    mapTypeControlOptions: {
        mapTypeIds: [
            google.maps.MapTypeId.ROADMAP, 'map_style1', 'map_style2'
        ]
    }

因此，假设您在某处定义了样式Nuit和Plan，如:

var Nuit = [{ ...features style... }];
var Plan = [{ ...features style... }];

我会把你的init函数改成:

function initialiser() {
    <?php include("cartes.js");?>
    var nightMap = new google.maps.StyledMapType(Nuit,{name: "Nuit"});
    var planMap = new google.maps.StyledMapType(Plan,{name: "Plan"});
    var options = {
        center: new google.maps.LatLng(49.894524, 2.30195),
        zoom: 13,
        mapTypeControlOptions: {
            mapTypeIds: [
                google.maps.MapTypeId.ROADMAP, 'map_style1', 'map_style2'
            ]
        }
    };
    var carte = new google.maps.Map(document.getElementById("carte"), options);
    carte.mapTypes.set('map_style2', nightMap);
    carte.setMapTypeId('map_style2');
    carte.mapTypes.set('map_style1', planMap);
    carte.setMapTypeId('map_style1');
    <?php include("geolocalisation.js");?>
    ...
相关文章：