0

Google Maps API を使用しています。42floors.com の Google map UI のような UI を取得したいと考えています。

UIをどのように変更しているのか、誰か助けてもらえますか?

彼らはマップスタイルを使用していると思います https://developers.google.com/maps/documentation/javascript/examples/maptype-styled-simple

var map;
var brooklyn = new google.maps.LatLng(40.6743890, -73.9455);

var MY_MAPTYPE_ID = 'custom_style';

function initialize() {

  var featureOpts = [
    {
      featureType: 'road',
      elementType: 'geometry',
      stylers: [
        { hue: -45 },
        { saturation: 100 }
      ]
    },
    {
      featureType: 'landscape',
      elementType: 'geometry',
      stylers: [
        { hue: '#000000' },
        { saturation: 75 },
        { lightness: -100}
      ]
    }
  ];

  var mapOptions = {
    zoom: 12,
    center: brooklyn,
    mapTypeControlOptions: {
      mapTypeIds: [google.maps.MapTypeId.ROADMAP, MY_MAPTYPE_ID]
    },
    mapTypeId: MY_MAPTYPE_ID
  };

  map = new google.maps.Map(document.getElementById('map-canvas'),
      mapOptions);

  var styledMapOptions = {
    name: 'Custom Style'
  };

  var customMapType = new google.maps.StyledMapType(featureOpts, styledMapOptions);

  map.mapTypes.set(MY_MAPTYPE_ID, customMapType);
}

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

2 に答える 2

0

はい、これはマップ スタイルの実装です。彼らのコードを見てください。Google マップ ライブラリを埋め込むと、カスタム Javascript ファイルが見つかります(リンクは時々変更される可能性があります)。「ROADMAP」などの文字列の検索を開始すると、スタイルが定義されているセクションが見つかります。このファイルは縮小されており、実際には人間が読めるものではないことに注意してください。

于 2013-04-25T06:45:45.507 に答える