Can react-google-maps use Image Map Types?

淺唱寂寞╮ 提交于 2021-01-29 13:19:22

问题


i'm tring to reproduce the example show in: https://developers.google.com/maps/documentation/javascript/examples/maptype-image

with react-google-maps. it doesn't seem to have the same class google.maps.ImageMapType. Did u know if there's a class that can help me or if someone already did this, link me the example?

  <GoogleMap
className="maps"
defaultZoom={17}
defaultCenter={{ lat: 46.215951, lng: 12.306994 }}
defaultMapTypeId="moon"
defaultExtraMapTypes={[{id:"moon", mapType:{
      getTileUrl: function(coord, zoom) {
          return "mw1.google.com/mw-planetary/lunar/lunarmaps_v1/clem_bw/1/1/0.jpg";
      },
      maxZoom: 9,
      minZoom: 0,
      radius: 1738000,
      name: 'Moon'
    }}]}
defaultOptions={{
 // these following 7 options turn certain controls off see link below
  streetViewControl: false,
  scaleControl: false,
  mapTypeControl: false,
  panControl: false,
  zoomControl: false,
  rotateControl: false,
  fullscreenControl: false
}}

disableDefaultUI>

i try to do something like that


回答1:


I find the trick. I create the const ImageMapType like the example show and exported it.

in my map component i use these properties:

defaultOptions={{
              maxZoom: 18,
              mapTypeControlOptions: {
                mapTypeIds: ['moon','satellite']
              }
          }}
          mapTypeId={google ? 'moon' : 'satellite'}
          defaultExtraMapTypes={[
              ['moon', mapStyles ]
          ]}

to link it the map. defaultExtraMapTypes replace the map.set in the google api.



来源:https://stackoverflow.com/questions/53139750/can-react-google-maps-use-image-map-types

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!