search

fullstackreact / google-maps-react

Companion code to the "How to Write a Google Maps React Component" Tutorial
https://www.fullstackreact.com/articles/how-to-write-a-google-maps-react-component/
MIT License
1.64k stars 819 forks source link

Request: Marker label #30

Open kevinSuttle opened 8 years ago

kevinSuttle commented 8 years ago

https://developers.google.com/maps/documentation/javascript/examples/marker-labels https://github.com/fullstackreact/google-maps-react/blob/master/src/components/Marker.js#L85

Szarko commented 7 years ago

👍

sergical commented 7 years ago

Any update on this?

ryanoboril commented 6 years ago

I realize that this is nearly 2 years late to the party but you can use the label prop of the Marker, which can either be a string or a MarkerLabel object. Just assign an object with props in that API to the label prop of your Marker, like this:

<Marker
  position={center}
  label={{
    text: "Hello World!",
    fontFamily: "Arial",
    fontSize: "14px",
  }}
  icon={{
    url: imageUrl,
    anchor: new google.maps.Point(53,53),
    labelOrigin: new google.maps.Point(53,115),
  }}
/>

I hope this helps someone!

ziaulrehman40 commented 4 years ago

image It shows label outside the marker, can i show label in the marker like https://developers.google.com/maps/documentation/javascript/examples/marker-labels