PaulLeCam / react-leaflet

React components for Leaflet maps
https://react-leaflet.js.org
Other
5.17k stars 887 forks source link

React + Leaflet with html markers #4

Closed soueuls closed 9 years ago

soueuls commented 10 years ago

Hello,

I just noticed your message on Twitter, I really not a CoffeeScript expert so I mostly translate your coffee in JS so I can learn from it. My main probleme is that I am trying to put some very customized marker with leaflet (an iconDiv one with html) But ReactComponents are not html but leaflet is expecting some html to work. My question is how would you approach this ?

By the way I posted my question in English as maybe it can help someone reading this but I am French like you, so if my question is not properly asked, I can explain it in French.

Thanks. :)

PaulLeCam commented 10 years ago

Hi,

You can pass any option used by Leaflet as property of the component, ex: <Marker icon={myIcon} />.

Alternatively you can always use the Leaflet library to add other elements to the map. It may not be easy at the moment but I'm working on making these elements easily accessible by components.

soueuls commented 10 years ago

Yeah but then that's managed by React instead of Leaflet, I have been playing around with it for few days, and my mind can't figure out how to properly mix them both. For customized markers I tried to do a React.renderToStaticMarkup but I don't think this is the proper way to go.

PaulLeCam commented 10 years ago

Leaflet will insert its own HTML, so for elements with HTML properties, it should be set as such, either using React.renderToStaticMarkup() on React components or HTML.