我看过这个链接:
Google map api v3 add polylines from array
这在某种程度上和我的问题有点相同..你看,我得到一个javscript错误:
Uncaught TypeError: Cannot call method 'getPath' of undefined
AddCoordinate map:118
(anonymous function)
我的代码基本上是填充坐标,因为页面与地图一起加载..当点击被触发时(html按钮),这是唯一一次用多边形线绘制地图..我希望我解释得很好..这就是我得到的:
var map;
var Markers = [];
var Coordinates = [];
var LinePath;
function initialize()
{
var myLatLng = new google.maps.LatLng(21.291982, -140.821856);
var myOptions = {
zoom: 3,
center: myLatLng,
mapTypeId: google.maps.MapTypeId.SATELLITE
};
var MarkerSize = new google.maps.Size(48,48);
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}
function AddCoordinate( lat, long ) {
var path = LinePath.getPath();
path.push( new google.maps.LatLng( lat, long ) );
LinePath.setPath(path);
}
function PlotLine()
{
LinePath = new google.maps.Polyline({
path:Coordinates,
strokeColor:"#ffffff",
strokeOpacity:1.0,
strokeWeight:5
});
LinePath.setMap(map);
}
<html>
<body onload="initialize()">
<div id="map_canvas" ></div>
<?php
foreach($arrayOfPlotPoints as $key => $value){
$longitude = round($value['longitude'],5);
$latitude = round($value['latitude'],5);
$snrLevel = $value['snr_level'];
echo '<script type="text/javascript">AddCoordinate('.$latitude.','.$longitude.')</script>';
?>
<option value="<?php echo $longitude.",".$latitude.",".$snrLevel?>"> Lg:<?php echo $longitude." Lt: ".$latitude." LV: ".$snrLevel?></option>
<?php } ?>
</select>
<br /><br />
<?php echo $this->Form->button('PLOT', array('type'=>'button', 'onclick'=>'PlotLine()')); ?>
echo $this->Form->button('PLOT', array('type'=>'button', 'onclick'=>'PlotLine()'));
?>
******** EDITED **********
我对我的代码进行了部分修改..但是我得到了相同的错误..
Uncaught TypeError: Cannot call method 'getPath' of undefined
AddCoordinate (anonymous function)
function initialize() {
//.....
LinePath = new google.maps.Polyline({
path:Coordinates, //san ka galing Coordinates??? dineclare ka pero di ka aman nilagyan "YATA" ng laman
strokeColor:"#ffffff",
strokeOpacity:1.0,
strokeWeight:5
});
}
function AddCoordinate( latitude, longitude ) {
var path = LinePath.getPath();
path.push( latitude, longitude );
}
function PlotLine()
{
LinePath = new google.maps.Polyline({
path:Coordinates,
strokeColor:"#ffffff",
strokeOpacity:1.0,
strokeWeight:5
});
LinePath.setMap(map);
}
<HTML>
select name="long_and_lat" id="long_and_lat" style="width:220px;height:250px;" size="100">
<?php
$plotPoints = array();
foreach($arrayOfPlotPoints as $key => $value){
$longitude = round($value['longitude'],5);
$latitude = round($value['latitude'],5);
$snrLevel = $value['snr_level'];
echo '<script type="text/javascript">AddCoordinate('.$latitude.','.$longitude.')</script>';
?>
<option value="<?php echo $longitude.",".$latitude.",".$snrLevel?>"> Lg:<?php echo $longitude." Lt: ".$latitude." LV: ".$snrLevel?></option>
<?php } ?>
</select>
<br /><br />
<?php echo $this->Form->button('PLOT', array('type'=>'button', 'onclick'=>'PlotLine()')); ?>
</html>
答案 0 :(得分:1)
您正在LinePath
拨打AddCoordinate()
,但在调用LinePath
之前不会创建PlotLine()
(通过点击按钮)。
也许您可以在声明时创建LinePath
,然后只需从LinePath.setMap(map);
拨打PlotLine()
。
也许是这样的:
<html>
<head>
<link href="https://google-developers.appspot.com/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
var map;
var Markers = [];
var Coordinates = [];
var LinePath = new google.maps.Polyline({
path:Coordinates,
strokeColor:"#ffffff",
strokeOpacity:1.0,
strokeWeight:5
});
function initialize()
{
var myLatLng = new google.maps.LatLng(21.291982, -140.821856);
var myOptions = {
zoom: 3,
center: myLatLng,
mapTypeId: google.maps.MapTypeId.SATELLITE
};
var MarkerSize = new google.maps.Size(48,48);
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}
function AddCoordinate( lat, long ) {
var path = LinePath.getPath();
path.push( new google.maps.LatLng( lat, long ) );
LinePath.setPath(path);
}
function PlotLine()
{
LinePath.setMap(map);
}
</script>
</head>
<body onload="initialize()">
<div id="map_canvas" ></div>
<script type="text/javascript">AddCoordinate(11,12)</script>
</body>
</html>