我正在使用此示例来设置包含8个以上标记的路径.
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<title>Google Maps JavaScript API v3 Example: Directions Waypoints</title>
<style>
#map{
width: 100%;
height: 450px;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script>
jQuery(function() {
var stops = [
{"Geometry":{"Latitude":52.1615470947258,"Longitude":20.80514430999756}},
{"Geometry":{"Latitude":52.15991486090931,"Longitude":20.804049968719482}},
{"Geometry":{"Latitude":52.15772967999426,"Longitude":20.805788040161133}},
{"Geometry":{"Latitude":52.15586034371232,"Longitude":20.80460786819458}},
{"Geometry":{"Latitude":52.15923693975469,"Longitude":20.80113172531128}},
{"Geometry":{"Latitude":52.159849043774074, "Longitude":20.791990756988525}},
{"Geometry":{"Latitude":52.15986220720892,"Longitude":20.790467262268066}},
{"Geometry":{"Latitude":52.16202095784738,"Longitude":20.7806396484375}},
{"Geometry":{"Latitude":52.16088894313116,"Longitude":20.77737808227539}},
{"Geometry":{"Latitude":52.15255590234335,"Longitude":20.784244537353516}},
{"Geometry":{"Latitude":52.14747369312591,"Longitude":20.791218280792236}},
{"Geometry":{"Latitude":52.14963304460396,"Longitude":20.79387903213501}}
] ;
var map = new window.google.maps.Map(document.getElementById("map"));
// new up complex objects before passing them around
var directionsDisplay = new window.google.maps.DirectionsRenderer();
var directionsService = new window.google.maps.DirectionsService();
Tour_startUp(stops);
window.tour.loadMap(map, directionsDisplay); …我一直收到这个错误"Uncaught TypeError:在尝试创建地图时无法读取未定义的属性'LatLng'
在头部:
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.js"/>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3&sensor=true"></script>
.............
function init(){
var latlng = new google.maps.LatLng(-43.552965, 172.47315);
var myOptions = {
zoom: 10,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map"), myOptions);
}
.............
<body>
<div id="map" style="width:600px;height: 600px;">
</div>
<ul class="navigation">
</ul>
</body>
Marker没有实现Parcelable,Serializable接口,但我需要在Activity onPause/ 之间保持它onResume,所以我怎么能坚持下去呢？我怎样才能获得所有当前的标记列表(在任何地方都找不到getMarkers()方法)？
想象一下下一个案例:我已经添加Marker并开始AsyncTask为Marker执行长时间运行的任务和更新视图.任务正在进行中,我改变方向,重新创建活动.任务完成后如何更新该标记？让我们想象一下,我可以坚持标记的ID和标记自动保存片段(想象一下),然后如何在重新创建活动后使用id找到它？
我正在使用Google Maps Api v3做一个项目.我想要提供一个包含餐馆的点的完整列表,并希望以某种方式允许用户选择餐馆类型,显示和隐藏类型.
这可以使用图层,或者更正确,我清除所有点并再次将它们上传到地图上,这可能会使它变慢.
TKS
我尝试了很多但无法找出问题所在。我想围绕特定的经纬度绘制一个多边形。该多边形将由特定半径的 13 个坐标组成。
代码
function showAddress(address, miles) {
var geocoder = new google.maps.Geocoder();
geocoder.geocode({
address : address
}, function(results, status) {
if(status == google.maps.GeocoderStatus.OK) {
//searchLocationsNear(results[0].geometry.location);
var cordinate = results[0].geometry.location;
//alert(cordinate);
var mapOptions = {
center : cordinate,
zoom : 8,
mapTypeId : google.maps.MapTypeId.ROADMAP,
overviewMapControl : true,
overviewMapControlOptions : {
opened : true,
position : google.maps.ControlPosition.BOTTOM_LEFT
}
};
//
//var address = document.getElementById("address").value;
var radius = 1;
var latitude = 23.1793013;
var longitude …我有一个地图,其中包含多个带有infowindows的标记.infowindows需要在页面加载时打开.使用setbounds将地图集中在一起以合并所有标记,这些标记有效,但它还需要在边界内包含infowindows.目前,infowindows被裁剪到位.
JS:
function initialize() {
var map = new google.maps.Map(document.getElementById('map-canvas'));
var bounds = new google.maps.LatLngBounds();
var myLatlng1 = new google.maps.LatLng(51.525209,-0.09402479999994284)
var contentString1 = '<div class="map-content"><p>Test1<br/ >dsfasdf<br/ >dsfasdf<br/ >dsfasdf<br/ >dsfasdf<br/ >dsfasdf<br/ >dsfasdf</p></div>'
var infowindow1 = new google.maps.InfoWindow({content: contentString1});
var marker1 = new google.maps.Marker({position: myLatlng1,map: map,title: 'Test1'});
google.maps.event.addListener(marker1, 'click', function() {infowindow1.open(map,marker1);});
infowindow1.open(map,marker1);
bounds.extend(myLatlng1);
var myLatlng2 = new google.maps.LatLng(51.52106840183588,-0.10866641049801729)
var contentString2 = '<div class="map-content"><p><br/ >dsfasdf<br/ >dsfasdf<br/ >dsfasdf<br/ >dsfasdf<br/ >dsfasdf</p></div>'
var infowindow2 = new google.maps.InfoWindow({content: contentString2});
var marker2 = new google.maps.Marker({position: myLatlng2,map: map,title: 'Test2'}); …我刚接触谷歌地图api并完成了地理编码示例:
https://developers.google.com/maps/documentation/javascript/examples/geocoding-simple
我希望能够在我的代码中对字符串进行地理编码,并在该位置放置标记,而不是用户搜索位置.到目前为止我的代码是:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<title>Geocoding service</title>
<style>
html, body, #map-canvas
{
height: 100%;
margin: 0px;
padding: 0px
}
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script>
//global variables
var geocoder;
var map;
var Ireland = "Dublin";
function initialize()
{
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(53.3496, -6.3263);
var mapOptions =
{
zoom: 8,
center: latlng
}
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
codeAddress();//call the function
}
function codeAddress()
{
var address = document.getElementById("Ireland").value;
geocoder.geocode( …我的webapp收到用户选择的地理位置的place_id.例如:如果用户在前端选择一个名为"Comacchio"的地方(它是一个城镇,也就是被称为费拉拉省的administrative_area_level_2的一部分),我的webapp会为Comacchio重新找到place_id : .ChIJ0yHebbB1fkcR7YujotES0dA
当我向maps.googleapis.com查询所说的place_id时,我得到了大量的信息(见下文)但不是我需要的信息:我需要的是输入place_id 的administrative_area_level_2的place_id(ChIJ7y4rEyxCfkcRwH-6_AubBwM适用于Provincia di费拉拉).
正如您在下面看到的,Provincia di Ferrara以字符串形式返回,但不是我需要的place_id.
Array (
[html_attributions] => Array(
)
[result] => Array (
[address_components] => Array (
[0] => Array (
[long_name] => Comacchio
[short_name] => Comacchio
[types] => Array (
[0] => locality
[1] => political
)
)
[1] => Array (
[long_name] => Comacchio
[short_name] => Comacchio
[types] => Array (
[0] => administrative_area_level_3 …我在我的页面上使用Google Maps API,该页面要求用户填写"当前地址"和"新地址".
我可以让自动完成工作在第一个地址,但它不适用于第二个地址,我做了很多研究,并查看了stackoverflow上的simular帖子,但我找不到任何有同样问题的人.
这是我的代码;
<div id="locationField">
<input id="autocomplete" placeholder="Start typing your address" onFocus="geolocate()" type="text"></input>
</div>
<div id="addressone">
<input type="text" id="street_number" name="street_number"></input>
<input type="text" id="route" name="street_name"></input>
<input type="text" id="locality" name="town_city"></input>
<input type="text" id="postal_code" name="postcode"></input>
<input type="text" id="country" name="country"></input>
</div>
<div id="locationField2">
<input id="autocomplete2" placeholder="Start typing your address" onFocus="geolocate()" type="text"></input>
</div>
<div id="addresstwo">
<input type="text" id="street_number2" name="street_number2"></input>
<input type="text" id="route2" name="street_name2"></input>
<input type="text" id="locality2" name="town_city2"></input>
<input type="text" id="postal_code2" name="postcode2"></input>
<input type="text" id="country2" name="country2"></input>
</div>
<script>
// This example displays an address …我一直在学习React 16.8的新功能。我相信React的Pure Component应该自动避免不必要的重新渲染操作。
在以下示例中，App自身本身是无状态组件。我useState用来维护两个状态对象text和nested: {text}。
有3个测试。前两个测试有效。无论有多少次，我都会更改状态，无需进行任何重新渲染操作。
现在，第三个测试尝试text使用相同的字符串值设置状态，但是引用不同。我希望什么都不会重新呈现，但是实际上，<Headline/>将会重新呈现。
我应该使用某种记忆方式来避免吗？我觉得将其存档将太多代码。并且程序员必须非常小心地编写高质量的React代码。..
class Headline extends React.PureComponent {
render() {
const {text} = this.props;
return <h1>{text} (render time: {Date.now()})</h1>;
}
}
const simpleText = 'hello world'
const App = () => {
const [text, setText] = React.useState(simpleText)
const [nested, setNested] = React.useState({text: simpleText})
return (
<div>
<Headline text={text}/>
<Headline text={nested.text}/>
<button onClick={()=>setText(simpleText)}>
test 1: the first line should not change (expected)
</button>
<button …google-maps ×8
javascript ×5
android ×1
api ×1
fitbounds ×1
geocoding ×1
infowindow ×1
php ×1
react-hooks ×1
reactjs ×1