React-leaflet bounds
<p>Right now I am setting the bounds of my react leaflet map by passing a bounds parameter as shown below: </p>

<pre><code>   &lt;div hidden={!this.props.hide &amp;&amp; !this.props.toggle} className="map-container"&gt;

       &lt;Leaflet.Map ref='leaflet-map' bounds={ this.getBounds()} &gt;

       &lt;Leaflet.TileLayer url='http://{s}.tile.osm.org/{z}/{x}/{y}.png'/&gt;

             { this.geoResults().map(this.renderMarker) }


       &lt;/Leaflet.Map&gt;

   &lt;/div&gt;
</code></pre>

<p>The problem is that sometimes a marker is rendered on the outermost part of the map (in view) so the marker is not even visible unless I drag the map or zoom out one spot. I was trying to fix this with a buffer or trying to plot the bounds then use zoom to zoom out once but nothing seems to work. Do you guys have any ideas? </p>