-1
Google haritası görüntülenmiyor, ancak arama kutusu yok. Bu kodla ilgili sorunun ne olduğunu bilmiyorum. Ekranda görünmeme sebebi olan div boyutunu bile ayarladım. CSS dosyalarını eklemedim.google map görüntülenmiyor, ancak arama kutusu
HTML kodu: Kodum aşağıda verilmiştir
<body>
<div id="wrapper">
<nav class="navbar navbar-default navbar-cls-top " role="navigation" style="margin-bottom: 0">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".sidebar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="header-right">
<img src="logo (1).ico" height="70px" width="70px" alt="Invite Logo">
<img src="logo (2).ico" height="70px" width="70px" alt="Invite Logo">
</div>
</nav>
<nav class="navbar-default navbar-side" role="navigation">
<div class="sidebar-collapse">
<ul class="nav" id="main-menu">
<li>
<div class="user-img-div">
<img src="user.png" class="img-thumbnail" />
<div class="inner-text">
Khadiza Kobra
</div>
</div>
</li>
<li>
<a href="check-in.html"><i class="fa fa-dashboard "></i>Maps</a>
</li>
<li>
<a href="friends.html"><i class="fa fa-desktop"></i>My Circle</a>
</li>
<li>
<a class="active-menu-top" href="#"><i class="fa fa-yelp "></i>Settings<span class="fa arrow"></span></a>
<ul class="nav nav-second-level collapse in">
<li>
<a href="profile.html"><i class="fa fa-coffee"></i>Profile</a>
</li>
<li>
<a href="account settings.html"><i class="fa fa-flash "></i>account settings</a>
</li>
<li>
<a class="active-menu" href="index.html"><i class="fa fa-send "></i>logout</a>
</li>
</ul>
</li>
<li>
<a href="notifications.html"><i class="fa fa-flash "></i>notifications</a>
</li>
<li>
<a href="friends reviews.html"><i class="fa fa-anchor "></i>Friends reviews</a>
</li>
</ul>
</div>
</nav>
<div id="page-wrapper" >
<div id="page-inner" >
<div class="row">
<input id="pac-input" class="controls" type="text" placeholder="Search Box">
<div id="map"></div>
<script>
function initAutocomplete() {
var map = new google.maps.Map(document.getElementById('map'), {
center: {lat: 23.685, lng: 90.3563},
zoom: 13,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var input = document.getElementById('pac-input');
var searchBox = new google.maps.places.SearchBox(input);
map.controls[google.maps.ControlPosition.TOP_LEFT].push(input);
map.addListener('bounds_changed', function() {
searchBox.setBounds(map.getBounds());
});
var markers = [];
searchBox.addListener('places_changed', function() {
var places = searchBox.getPlaces();
if (places.length == 0) {
return;
}
markers.forEach(function(marker) {
marker.setMap(null);
});
markers = [];
var bounds = new google.maps.LatLngBounds();
places.forEach(function(place) {
var icon = {
url: place.icon,
size: new google.maps.Size(71, 71),
origin: new google.maps.Point(0, 0),
anchor: new google.maps.Point(17, 34),
scaledSize: new google.maps.Size(25, 25)
};
markers.push(new google.maps.Marker({
map: map,
icon: icon,
title: place.name,
position: place.geometry.location
}));
if (place.geometry.viewport) {
bounds.union(place.geometry.viewport);
} else {
bounds.extend(place.geometry.location);
}
});
map.fitBounds(bounds);
});
setMarkers(map);
}
var beaches = [
['Dhaka', 23.777176, 90.399452, 4],
['Mirpur 10', 23.8375, 90.3753, 5],
['Shahbag', 23.7381, 90.3954, 3],
['Dhanmondi 5', 23.7459, 90.3852, 2],
['MIST Mirpur', 23.8383, 90.3606, 1]
];
function setMarkers(map) {
var image = {
url: 'map_icon.png',
size: new google.maps.Size(20, 32),
origin: new google.maps.Point(0, 0),
anchor: new google.maps.Point(0, 32)
};
var shape = {
coords: [1, 1, 1, 20, 18, 20, 18, 1],
type: 'poly'
};
for (var i = 0; i < beaches.length; i++) {
var beach = beaches[i];
var marker = new google.maps.Marker({
position: {lat: beach[1], lng: beach[2]},
map: map,
icon: image,
shape: shape,
title: beach[0],
zIndex: beach[3]
});
}
}
</script>
<script type="text/javascript" src="https://maps.google.com/maps/api/js?key=AIzaSyBZlGIVcYhTwGPkeeZKj4GgcODjFps8y8U&sensor=true">
</script>
</body>
i benim map.But o çalışmıyor için bir boyut eklemiş! –
tarayıcı colsole içinde hatalar olup olmadığını kontrol edin .. – scaisEdge