栃木県のJavaエンジニア、WEBプログラマーのためのサイト

2017.05.16Google Maps™で詳細情報を表示する

Google Maps™の埋め込みはデフォルトでは簡略化されています。

付近店舗情報等を表示する為には下記設定を行うと表示可能です。

var myMap;
var options = {
  zoom               : 17,
  center             : new google.maps.LatLng(36.557911, 139.884325),
  mapTypeId          : google.maps.MapTypeId.ROADMAP,
  mapTypeIds: [
    'mainmap',
    google.maps.MapTypeId.HYBRID,
    google.maps.MapTypeId.SATELLITE,
    google.maps.MapTypeId.TERRAIN
  ],
  panControl         : false,
  streetViewControl  : false,
  zoomControl        : true,
  mapTypeControl     : false,
  scaleControl       : true,
  scaleControlOptions: { position: google.maps.ControlPosition.BOTTOM_LEFT },
  overviewMapControl : false,
  draggable          : true,
  scrollwheel        : false, //-  wheelにフォーカスを奪われると使い勝手が悪いので指定すると良い
  noClear : true,
  backgroundColor: "#efefef"
}
var mapstyle = [
  {
    featureType:"all",
    elementType:"all",
    stylers: [
      {visibility: "on" }
    ]
  }
];
myMap = new google.maps.Map(document.getElementById("貼り付け先ID"), options);
var styleMapOptions = {
  map: myMap
}
var myMapType = new google.maps.StyledMapType(mapstyle, styleMapOptions);
myMap.mapTypes.set('mainmap', myMapType);
myMap.setMapTypeId('mainmap');

重要なのは

    featureType:"all",
    elementType:"all",

で全ランドマーク等を表示する処理を明示的に指定する部分です。