Skip to content

'zoom' not listed as a valid propType in the index.ts file #443

New issue
New issue
Open
#466
#445
Open
'zoom' not listed as a valid propType in the index.ts file#443
#466
#445
@nzayatz14

Description

@nzayatz14
nzayatz14
opened on May 19, 2020

You have several examples using the zoom prop to set the zoom level of the map, but this prop is not listed in the IMapProps definition in the index.ts file, making it unusable for typescript projects.

Current value:

export interface IMapProps extends google.maps.MapOptions {
  google: GoogleAPI
  loaded?: boolean

  style?: Style
  containerStyle?: Style

  bounds?: google.maps.LatLngBounds | google.maps.LatLngBoundsLiteral
  centerAroundCurrentLocation?: boolean
  initialCenter?: google.maps.LatLngLiteral
  center?: google.maps.LatLngLiteral

  visible?: boolean

  onReady?: mapEventHandler
  onClick?: mapEventHandler
  onDragend?: mapEventHandler
  onRecenter?: mapEventHandler
  onBoundsChanged?: mapEventHandler
  onCenterChanged?: mapEventHandler
  onDblclick?: mapEventHandler
  onDragstart?: mapEventHandler
  onHeadingChange?: mapEventHandler
  onIdle?: mapEventHandler
  onMaptypeidChanged?: mapEventHandler
  onMousemove?: mapEventHandler
  onMouseover?: mapEventHandler
  onMouseout?: mapEventHandler
  onProjectionChanged?: mapEventHandler
  onResize?: mapEventHandler
  onRightclick?: mapEventHandler
  onTilesloaded?: mapEventHandler
  onTiltChanged?: mapEventHandler
  onZoomChanged?: mapEventHandler
}

Activity

mandros1

mandros1 commented on May 20, 2020

@mandros1
mandros1
on May 20, 2020 · edited by mandros1

+1 I also noticed this, which is weird since it is so boldly simple in the readme, but I did read somewhere in their readme that the bounds property should set the zoom as well (which makes sense) but I still haven't been able to get it to do anything, the original code of it is below

var points = [
  { lat: 42.02, lng: -77.01 },
  { lat: 42.03, lng: -77.02 },
  { lat: 41.03, lng: -77.04 },
  { lat: 42.05, lng: -77.02 }
]
const bounds = new this.props.google.maps.LatLngBounds()

for (var i = 0; i < points.length; i++) {
  bounds.extend(points[i]);
}

return (
  <Map 
    google={this.props.google}
    style={containerStyle}
    initialCenter={{
        lat: 42.39,
        lng: -72.52
    }}
    bounds={bounds}
  >)
luiscassih

luiscassih commented on May 25, 2020

@luiscassih
luiscassih
on May 25, 2020

Adding the @types/googlemaps package solved the zoom issue with typescript but now I've facing another ts compiler error with TS7006: Parameter 'event' implicitly has an 'any' type. on ./node_modules/google-maps-react/index.d.ts:27:70
Makes this package unusable for me on typescript

MaciekBaron
linked a pull request that will close this issue on May 27, 2020
hirokikondo86
linked a pull request that will close this issue on Aug 12, 2020
naupaw
mentioned this on Sep 17, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      Participants

      @luiscassih@nzayatz14@mandros1

      Issue actions
        'zoom' not listed as a valid propType in the index.ts file · Issue #443 · fullstackreact/google-maps-react