1个出处,多个目的地,相同的谷歌地图v3 - 错误消息 [英] 1 origin, multiple destinations, same google map v3 - error message
问题描述
以下是我遇到的错误:
Uncaught TypeError:无法调用未定义的方法'setDirections'
Javascript代码:
google.maps.event.addDomListener(window,'load' ,初始化);
var directionsDisplay;
var map;
var route1 = new route();
var route2 = new route();
var route3 = new route();
var route4 = new route();
函数initialize(){
var austin = new google.maps.LatLng(30.2669,-87.7428);
var mapOptions = {
zoom:7,
mapTypeId:google.maps.MapTypeId.ROADMAP,
center:austin
}
map = new google .maps.Map(document.getElementById(map-canvas),mapOptions);
函数route(){
this.directionsService = new google.maps.DirectionsService();
this.directionsDisplay = new google.maps.DirectionsRenderer();
this.directionsDisplay.setMap(map);
//alert(JSON.stringify(this.directionsDisplay));
this.calcRoute = calcRoute;
函数calcRoute(end){
if(end === undefined){
end =New York;
}
var start = document.getElementById(start).value;
var request = {
origin:start,
destination:end,
travelMode:google.maps.TravelMode.DRIVING
};
this.directionsService.route(request,function(result,status){
if(status == google.maps.DirectionsStatus.OK){
alert(JSON.stringify(this.directionsService ));
this.directionsDisplay.setDirections(result);
}
});
$ / code>
HTML看起来像这样:
< select id =loc1onchange =route1.calcRoute(getElementById('loc1')。value);>
< option value =123 Anywhere lane NY>我的地址< / option>
如何解决错误并显示一个地图和一个原点和多个端点?
DirectionsService受制于配额和费率限制。如果您处理OVER_QUERY_LIMIT个案并返回,您可以检索多个路线。
以下几个示例:
As the title mentions, I'm trying to create one map that presents a single origin with directions rendered for multiple destinations (not waypoints). I managed to achieve this with tons of duplicate code. However, I want to consolidate the code into one reusable javascript object but having challenges, possibly with proper scoping of things?
Here is the error I encounter:
Uncaught TypeError: Cannot call method 'setDirections' of undefined
Javascript code:
google.maps.event.addDomListener(window, 'load', initialize);
var directionsDisplay;
var map;
var route1 = new route();
var route2 = new route();
var route3 = new route();
var route4 = new route();
function initialize() {
var austin = new google.maps.LatLng(30.2669, -87.7428);
var mapOptions = {
zoom: 7,
mapTypeId: google.maps.MapTypeId.ROADMAP,
center: austin
}
map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);
}
function route() {
this.directionsService = new google.maps.DirectionsService();
this.directionsDisplay = new google.maps.DirectionsRenderer();
this.directionsDisplay.setMap(map);
//alert(JSON.stringify(this.directionsDisplay));
this.calcRoute = calcRoute;
function calcRoute(end) {
if (end === undefined) {
end = "New York";
}
var start = document.getElementById("start").value;
var request = {
origin: start,
destination: end,
travelMode: google.maps.TravelMode.DRIVING
};
this.directionsService.route(request, function (result, status) {
if (status == google.maps.DirectionsStatus.OK) {
alert(JSON.stringify(this.directionsService));
this.directionsDisplay.setDirections(result);
}
});
}
}
HTML looks something like this:
<select id="loc1" onchange="route1.calcRoute(getElementById('loc1').value);">
<option value="123 Anywhere lane NY">my Address</option>
How do I resolve the error and display one map with one origin and multiple endpoints?
The DirectionsService is subject to a quota and rate limits. You can retrieve multiple routes if you handle the OVER_QUERY_LIMIT case and back off.
A couple of examples that do that:
- http://www.geocodezip.com/v3_directions_multipleWayPts_CustomMrkrsB.html
- http://www.geocodezip.com/v3_directions_multipleWayPts_CustomMrkrs_busRoute.html
这篇关于1个出处,多个目的地,相同的谷歌地图v3 - 错误消息的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!