搜索并存储经度和纬度,以协调数据库codeigniter,Map not Loading

时间:2017-06-21 17:41:16

标签: javascript mysql codeigniter google-maps

地图没有加载到页面上,加上搜索文本字段似乎不起作用,我在这里很困扰

CSS:

perl -Mopen=":std,:encoding(utf-16le)" -pe 's/[[:blank:]]+/,/g' test

JAVASCRIPT:

ActivityManager.TaskDescription

HTML:

html, body {
    height: 100%;
    margin: 0;
    padding: 0;
}
#map {
    height: 100%;
}
.controls {
    margin-top: 10px;
    border: 1px solid transparent;
    border-radius: 2px 0 0 2px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    height: 32px;
    outline: none;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
}
#pac-input {
    background-color: #fff;
    font-family: Roboto;
    font-size: 15px;
    font-weight: 300;
    margin-left: 12px;
    padding: 0 11px 0 13px;
    text-overflow: ellipsis;
    width: 300px;
}
#pac-input:focus {
    border-color: #4d90fe;
}
.pac-container {
    font-family: Roboto;
}
#type-selector {
    color: #fff;
    background-color: #4d90fe;
    padding: 5px 11px 0px 11px;
}
#type-selector label {
    font-family: Roboto;
    font-size: 13px;
    font-weight: 300;
}
#target {
    width: 345px;
}

我想使用function initAutocomplete() { var map = new google.maps.Map(document.getElementById('map'), { center: { lat: -33.8688, lng: 151.2195 }, zoom: 13, mapTypeId: google.maps.MapTypeId.ROADMAP }); // Create the search box and link it to the UI element. var input = document.getElementById('pac-input'); var searchBox = new google.maps.places.SearchBox(input); map.controls[google.maps.ControlPosition.TOP_LEFT].push(input); // Bias the SearchBox results towards current maps viewport. map.addListener('bounds_changed', function () { searchBox.setBounds(map.getBounds()); }); var markers = []; // [START region_getplaces] // Listen for the event fired when the user selects a prediction and retrieve // more details for that place. searchBox.addListener('places_changed', function () { var places = searchBox.getPlaces(); if (places.length == 0) { return; } // Clear out the old markers. markers.forEach(function (marker) { marker.setMap(null); }); markers = []; // For each place, get the icon, name and location. 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) }; // Create a marker for each place. var marker = new google.maps.Marker({ map: map, icon: icon, title: place.name, position: place.geometry.location }); google.maps.event.addListener(marker, 'click', function (evt) { document.getElementById('coordinates').value = marker.getPosition().toUrlValue(6); }); markers.push(marker); if (place.geometry.viewport) { // Only geocodes have viewport. bounds.union(place.geometry.viewport); } else { bounds.extend(place.geometry.location); } }); map.fitBounds(bounds); }); // [END region_getplaces] } google.maps.event.addDomListener(window, 'load', initAutocomplete); 中的搜索并获取<input id="coordinates" type="text" size="30" /> <input id="pac-input" class="controls" type="text" placeholder="Search Box"> <div id="map"></div> 的坐标,以便我可以将坐标存储到我的数据库中,但现在地图,不会加载和搜索盒子也没有回应。

0 个答案:

没有答案