JSFiddle - React, Tailwind, and code Playground
HTML
<div id="map_canvas" style="width: 100%; height: 500px"></div>
Значение:<input size="50" type="text" id="latbox" name="lat" value="">
<div id="resultContainer"></div>
CSS
* {
margin: 0;
padding: 0;
}
html, body {
height: 100%;
margin: 0px;
padding: 0px
}
#resultContainer {
width:230px;
font-family:tahoma;
font-size:15px;
padding:20px;
-webkit-box-shadow: 1px 1px 3px 1px #BFBFBF;
box-shadow: 1px 1px 3px 1px #BFBFBF;
}
#resultContainer img {
margin-bottom:10px;
border-radius:20px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border:1px solid #ccc;
width:80px;
height:80px;
}
JavaScript
var markersArray = [];
function initialize() {
var mapOptions = {
center: new google.maps.LatLng(49.053676508106875,33.423500061035156),
zoom: 12,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"),
mapOptions);
function func1() {
func2();
//Операторы func1
}
google.maps.event.addListener(map, "click", function(event) {
GetLocalWeather();
if (markersArray) {
for (i in markersArray) {
markersArray[i].setMap(null);
}
}
placeMarker(event.latLng);
var query= (event.latLng);
document.getElementById("latbox").value=event.latLng;
});
function placeMarker(location) {
var marker = new google.maps.InfoWindow({
position: location,
content: contentString,
map: map
});
markersArray.push(marker);
}
}
google.maps.event.addDomListener(window, 'load', initialize);