JSFiddle - React, Tailwind, and code Playground
by Mon Cervantes
HTML
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=true&libraries=places"></script>
<div id="map"></div>
CSS
#map {
height: 400px;
}
JavaScript
var infowindow,
placemarkers=[];
function placeSearch(map,request)
{
var map=map;
var service = new google.maps.places.PlacesService(map);
service.search(request,
function(results,status)
{
if (status == google.maps.places.PlacesServiceStatus.OK)
{
var bounds=new google.maps.LatLngBounds();
for (var i = 0; i < results.length; ++i)
{
bounds.extend(results[i].geometry.location);
placemarkers.push(createMarker(results[i].geometry.location,
map,
'http://labs.google.com/ridefinder/images/mm_20_orange.png',
results[i].name,
false,
{
fnc:function()
{
infowindow.open();
}
}));
}
map.fitBounds(bounds);
}
}
);
}
function createMarker(latlng,map,icon,content,center,action)
{
var marker = new google.maps.Marker({
map: map,
position: latlng,
content:content
});
if(icon){marker.setIcon(icon);}
if(center)
{
map.setCenter(latlng);
}
google.maps.event.addListener(marker, 'click', function() {
infowindow.setContent(this.content);
infowindow.open(map,...