google地图的路线实现代码

 更新时间:2009年08月20日 01:18:40   作者:  
google地图的路线实现代码,大家可以参考下,实现自己想要的功能。
复制代码 代码如下:

<script language="javascript" type="text/javascript">
//add by ahuinan 2009-8-17
//initialize(23.165613663312594,113.35968017578125)
var map;
var gdir;
var marker2;
var hasMarker = false;
var hotelLatLng = new GLatLng(<%=initxy %>);//初始化酒店的坐标
var polyline;
var points = [];
points[1] = hotelLatLng;
function initialize() {
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById("divMap"), { googleBarOptions: { showOnLoad: true} });
gdir = new GDirections(map);
map.setCenter(hotelLatLng, 9);
map.addControl(new GOverviewMapControl());
map.addControl(new GLargeMapControl());

//加入搜索框
map.enableGoogleBar();

map.enableScrollWheelZoom();

//创建酒店的标注,不可拖动
var hotelMarker = new GMarker(new GLatLng(<%=initxy %>));
map.addOverlay(hotelMarker);

//鼠标左键可以建立一个标记,
GEvent.addListener(map,"click",function(overlay,latlng,overlaylatlng){
if(latlng == null || hasMarker == true){
return;
}
var greenIcon = new GIcon(G_DEFAULT_ICON);
greenIcon.image = "../googlemap/green-dot.png";
greenIcon.iconSize = new GSize(32,32);
greenIcon.iconAnchor = new GPoint(16,32);
greenIcon.shadowSize=new GSize(56,33);
marker2 = new GMarker(latlng,{draggable: true,icon:greenIcon});
map.addOverlay(marker2);

GEvent.addListener(marker2,"dragend",function(){
points[0] = marker2.getLatLng();
gdir.loadFromWaypoints(points,{"preserveViewport":true});



})
GEvent.addListener(gdir, "addoverlay", function(){
for (var i=0; i<=gdir.getNumRoutes(); i++){
var originalMarker = gdir.getMarker(i);
map.removeOverlay(originalMarker);
}
polyline = gdir.getPolyline();


polyline.setStrokeStyle({color:"red",weight:2,opacity:1});
// map.addOverlay(polyline);

});
hasMarker = true;
points[0] = latlng;
gdir.loadFromWaypoints(points,{"preserveViewport":true});

})
}
}
//按下添加按钮
function add(){
if(points.length == 1){
alert("没有线路,终止操作");
}else{
window.opener.document.getElementById("txtHI_MapMarkDesc").value = window.opener.document.getElementById("txtHI_MapMarkDesc").value+"\n"+document.getElementById("txtName").value+"||||"+document.getElementById("txtType").value+"||||"+points[0]+"\n";
window.close();
}
}
window.onload = function() {
initialize()
}
</script>

相关文章

  • js实现数字跳动到指定数字

    js实现数字跳动到指定数字

    这篇文章主要为大家详细介绍了js实现数字跳动到指定数字,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-08-08
  • JS实现联想、自动补齐国家或地区名称的功能

    JS实现联想、自动补齐国家或地区名称的功能

    这篇文章主要介绍了JS实现联想、自动补齐国家或地区名称的功能,文中示例代码非常详细,帮助大家更好的理解和学习,感兴趣的朋友可以了解下
    2020-07-07
  • JS实现的全排列组合算法示例

    JS实现的全排列组合算法示例

    这篇文章主要介绍了JS实现的全排列组合算法,简单描述了全排列组合算法的原理并结合实例形式给出了全排列组合算法的具体实现技巧,需要的朋友可以参考下
    2017-10-10
  • 如何利用Three.js实现跳一跳小游戏

    如何利用Three.js实现跳一跳小游戏

    最近在公司写H5的3D游戏,选择了ThreeJS去做,做的过程中遇到了很多问题,下面这篇文章主要给大家介绍了关于如何利用Three.js实现跳一跳小游戏的相关资料,需要的朋友可以参考下
    2022-04-04
  • js计算时间差代码【包括计算,天,时,分,秒】

    js计算时间差代码【包括计算,天,时,分,秒】

    下面小编就为大家带来一篇js计算时间差代码【包括计算,天,时,分,秒】。小编觉得挺不错的,现在分享给大家,也给大家做个参考
    2016-04-04
  • javascript实现五星评价代码(源码下载)

    javascript实现五星评价代码(源码下载)

    大家在淘宝购物之后,都会对卖家的服务进行评论,那么五星评价代码是怎么实现的呢?下面小编给大家介绍基于Javascript实现五星评价代码,有需要的朋友可以参考下
    2015-08-08
  • 关于js陀螺仪的理解分析

    关于js陀螺仪的理解分析

    这篇文章主要给大家介绍了关于js陀螺仪的相关资料,文中通过示例代码介绍的非常详细,对大家学习或者使用js具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
    2019-04-04
  • 跨浏览器通用、可重用的选项卡tab切换js代码

    跨浏览器通用、可重用的选项卡tab切换js代码

    今天一同学对我说“好吧,我准备去学习”,我大惊,这老勾引我打dota的也去学习,于是我好奇他学什么,他说要搞一个选项卡切换js
    2011-09-09
  • JS实现电商商品展示放大镜特效

    JS实现电商商品展示放大镜特效

    这篇文章主要为大家详细介绍了JS实现电商商品展示放大镜特效,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-01-01
  • 微信小程序scroll-view实现滚动到锚点左侧导航栏点餐功能(点击种类,滚动到锚点)

    微信小程序scroll-view实现滚动到锚点左侧导航栏点餐功能(点击种类,滚动到锚点)

    这篇文章主要介绍了微信小程序scroll-view左侧导航栏点餐功能实现,点击种类,滚动到锚点;滚动到锚点,种类选中,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-06-06

最新评论