/**
* 这个例子演示了 Google 地图 API 的以下功能:
* * 可拖拽的标记
* * 在地图上叠加折线
* * 计算地理距离
* * 事件处理（单击、拖拽）
* * 信息窗口
* * 利用链表维护各种对象
* * 自定义控件
*
* 注意：为了在 IE6 中正常显示折线，必须在网页的 标签中加上：
*
*
* @author haogang
*/
/**
* 本示例用一个双向链表维护用户设定的标记，能够容易的实现标记的遍历和删除
* 每个链表结点 m 有如下字段：
* m.prev 前驱标记
* m.next 后继标记
* m.segPrev 连接本标记与前驱标记的线段
* m.segNext 连接本标记与后继标记的线段
*/
function GRulerControl() {
var me = this;
// 可国际化的字符串
me.RESET_BUTTON_TITLE_ = '清除所有测距标记';
me.ENABLE_BUTTON_TITLE_ = '添加测距标记已启用，单击这里禁用';
me.DISABLE_BUTTON_TITLE_ = '添加测距标记已禁用，单击这里启用';
me.DELETE_BUTTON_TITLE_ = '删除';
me.RESET_BUTTON_IMAGE_ = 'http://www.zhongguosou.com/zonghe/ditu/images/ruler_clear.png';
me.ENABLE_BUTTON_IMAGE_ = 'http://www.zhongguosou.com/zonghe/ditu/images/ruler_enabled.png';
me.DISABLE_BUTTON_IMAGE_ = 'http://www.zhongguosou.com/zonghe/ditu/images/ruler_disabled.png';
me.BACKGROUND_IMAGE_ = 'http://www.zhongguosou.com/zonghe/ditu/images/ruler_background.png'
me.KILOMETER_ = '公里';
me.METER_ = '米';
}
GRulerControl.prototype = new GControl();
/**
* 初始化标尺控件
*/
GRulerControl.prototype.initialize = function(map) {
var me = this;
var container = document.createElement('div');
me.setButtonStyle_(container);
// “启用/禁用”按钮
var btnEnable = document.createElement('img');
btnEnable.width = btnEnable.height = 19;
GEvent.addDomListener(btnEnable, 'click',
function() {
me.setEnabled(!me.isEnabled());
}
);
container.appendChild(btnEnable);
// “重置”按钮
var btnReset = document.createElement('img');
btnReset.width = btnReset.height = 19;
btnReset.src = me.RESET_BUTTON_IMAGE_;
btnReset.title = me.RESET_BUTTON_TITLE_;
GEvent.addDomListener(btnReset, 'click',
function() {
me.reset();
}
);
container.appendChild(btnReset);
// 距离标签
var txtInfo = document.createElement('div');
txtInfo.style.font = 'small Arial';
txtInfo.style.fontWeight = 'bold';
txtInfo.style.fontSize = '9pt';
txtInfo.style.width = '132px';
container.appendChild(txtInfo);
//经度或纬度单位转换
//小数点表示格式的经度或
var txtJingDu=document.createElement('div');
txtJingDu.style.width='124px';
txtJingDu.innerHTML="经纬度格式转换：
小数格式经度或纬度";
container.appendChild(txtJingDu);
var inputJingDu =document.createElement('input');
inputJingDu.style.width='90px';
container.appendChild(inputJingDu);
var txtJingDr=document.createElement('br');
container.appendChild(txtJingDr);
//相互转换按钮
var btnConvert = document.createElement('button');
btnConvert.style.width = '40px';
btnConvert.style.height = '18px';
btnConvert.value="转换";
GEvent.addDomListener(btnConvert, 'click',
function() {
me.convert();
}
);
container.appendChild(btnConvert);
var txtJW=document.createElement('div');
txtJW.style.width='123px';
txtJW.innerHTML="";
txtJW.style.color="#ff0000";
container.appendChild(txtJW);
var point;
//角度格式表示的经度或纬度
var txtJingDuJiao=document.createElement('div');
txtJingDuJiao.style.width='123px';
txtJingDuJiao.innerHTML="角度格式经度或纬度";
container.appendChild(txtJingDuJiao);
var inputDu =document.createElement('input');
inputDu.style.width = '25px';
container.appendChild(inputDu);
var inputDuTxt =document.createElement('label');
inputDuTxt.style.width='10px';
inputDuTxt.innerHTML="度";
inputDuTxt.style.border='0px';
container.appendChild(inputDuTxt);
var inputFen =document.createElement('input');
inputFen.style.width='25px';
container.appendChild(inputFen);
var inputFenTxt =document.createElement('label');
inputFenTxt.style.width='10px';
inputFenTxt.innerHTML="分";
inputFenTxt.style.border='0px';
container.appendChild(inputFenTxt);
var inputMiao =document.createElement('input');
inputMiao.style.width='25px';
container.appendChild(inputMiao);
var inputMiaoTxt =document.createElement('label');
inputMiaoTxt.style.width='10px';
inputMiaoTxt.innerHTML="秒";
inputMiaoTxt.style.border='0px';
container.appendChild(inputMiaoTxt);
var txtJDr=document.createElement('br');
container.appendChild(txtJDr);
var btnConvertB = document.createElement('button');
btnConvertB.style.width = '40px';
btnConvertB.style.height = '18px';
btnConvertB.value="转换";
GEvent.addDomListener(btnConvertB, 'click',
function() {
me.convertB();
}
);
container.appendChild(btnConvertB);
var txtBiaoZhun =document.createElement('div');
txtBiaoZhun.style.width="124px";
txtBiaoZhun.style.color="#ff0000";
container.appendChild(txtBiaoZhun);
//输入经纬度进行定位
var txtDingWei=document.createElement('div');
txtDingWei.style.width='123px';
txtDingWei.innerHTML="
输入经纬度进行定位";
container.appendChild(txtDingWei);
var jingdu=document.createElement('label');
jingdu.style.width='22px';
jingdu.innerHTML="经度(小数)";
//jingdu.readonly=true;
jingdu.style.border='0px';
container.appendChild(jingdu);
var jingduInput=document.createElement('input');
jingduInput.style.width='60px';
container.appendChild(jingduInput);
var txtdr=document.createElement('br');
container.appendChild(txtdr);
var weidu=document.createElement('label');
weidu.style.width='22px';
weidu.innerHTML="纬度(小数)";
weidu.style.border='0px';
container.appendChild(weidu);
var weiduInput=document.createElement('input');
weiduInput.style.width='60px';
container.appendChild(weiduInput);
var txtr=document.createElement('br');
container.appendChild(txtr);
var btnDingWei = document.createElement('button');
btnDingWei.style.width = '40px';
btnDingWei.style.height = '18px';
btnDingWei.value="定位";
GEvent.addDomListener(btnDingWei, 'click',
function() {
me.DingWei();
}
);
container.appendChild(btnDingWei);
//输入角度格式的经纬度进行定位
var txtrWho=document.createElement('p');
container.appendChild(txtrWho);
var txtDingWeiDu=document.createElement('div');
txtDingWeiDu.style.width='130px';
txtDingWeiDu.innerHTML="输入经纬度进行定位";
container.appendChild(txtDingWeiDu);
var jingduDu=document.createElement('label');
jingduDu.style.width='22px';
jingduDu.innerHTML="输入经度";
jingduDu.style.border='0px';
container.appendChild(jingduDu);
var txtrWho203=document.createElement('br');
container.appendChild(txtrWho203);
//度分秒格式的经度
var txtdrDuDu=document.createElement('br');
var inputDuDu =document.createElement('input');
inputDuDu.style.width='25px';
container.appendChild(inputDuDu);
var inputDuTxtDu =document.createElement('label');
inputDuTxtDu.style.width='10px';
inputDuTxtDu.innerHTML="度";
inputDuTxtDu.style.border='0px';
container.appendChild(inputDuTxtDu);
var inputFenDu =document.createElement('input');
inputFenDu.style.width='25px';
container.appendChild(inputFenDu);
var inputFenTxtDu =document.createElement('label');
inputFenTxtDu.style.width='10px';
inputFenTxtDu.innerHTML="分";
inputFenTxtDu.style.border='0px';
container.appendChild(inputFenTxtDu);
var inputMiaoDu =document.createElement('input');
inputMiaoDu.style.width='25px';
container.appendChild(inputMiaoDu);
var inputMiaoTxtDu =document.createElement('label');
inputMiaoTxtDu.style.width='10px';
inputMiaoTxtDu.innerHTML="秒";
inputMiaoTxtDu.style.border='0px';
container.appendChild(inputMiaoTxtDu);
var txtdrDu=document.createElement('br');
container.appendChild(txtdrDu);
var weiduDu=document.createElement('label');
weiduDu.style.width='22px';
weiduDu.innerHTML="输入纬度";
weiduDu.style.border='0px';
container.appendChild(weiduDu);
var txtdrDu244=document.createElement('br');
container.appendChild(txtdrDu244);
//角度格式的纬度
var txtdrDuDuWei=document.createElement('br');
var inputDuDuWei =document.createElement('input');
inputDuDuWei.style.width='25px';
container.appendChild(inputDuDuWei);
var inputDuTxtDuWei =document.createElement('label');
inputDuTxtDuWei.style.width='10px';
inputDuTxtDuWei.innerHTML="度";
inputDuTxtDuWei.style.border='0px';
container.appendChild(inputDuTxtDuWei);
var inputFenDuWei =document.createElement('input');
inputFenDuWei.style.width='25px';
container.appendChild(inputFenDuWei);
var inputFenTxtDuWei =document.createElement('label');
inputFenTxtDuWei.style.width='10px';
inputFenTxtDuWei.innerHTML="分";
inputFenTxtDuWei.style.border='0px';
container.appendChild(inputFenTxtDuWei);
var inputMiaoDuWei =document.createElement('input');
inputMiaoDuWei.style.width='25px';
container.appendChild(inputMiaoDuWei);
var inputMiaoTxtDuWei =document.createElement('label');
inputMiaoTxtDuWei.style.width='10px';
inputMiaoTxtDuWei.innerHTML="秒";
inputMiaoTxtDuWei.style.border='0px';
container.appendChild(inputMiaoTxtDuWei);
var txtrDu=document.createElement('br');
container.appendChild(txtrDu);
var btnDingWeiDu = document.createElement('button');
btnDingWeiDu.style.width = '40px';
btnDingWeiDu.style.height = '18px';
btnDingWeiDu.value="定位";
GEvent.addDomListener(btnDingWeiDu, 'click',
function() {
me.DingWeiDu();
}
);
container.appendChild(btnDingWeiDu);
// 初始化内部变量
map.rulerControl_ = me;
me.map_ = map;
me.head_ = new Object();
me.tail_ = new Object();
me.head_.next_ = me.tail_;
me.tail_.prev_ = me.head_;
me.btnEnable_ = btnEnable;
me.btnReset_ = btnReset;
me.txtInfo_ = txtInfo;
me.setEnabled(true);
me.inputJingDu_=inputJingDu;
me.txtJW_=txtJW;
me.txtBiaoZhun_=txtBiaoZhun;
me.inputDu_=inputDu;
me.inputFen_=inputFen;
me.inputMiao_=inputMiao;
me.jingduInput_=jingduInput;
me.weiduInput_=weiduInput;
me.inputDuDu_=inputDuDu;
me.inputFenDu_=inputFenDu;
me.inputMiaoDu_=inputMiaoDu;
me.inputDuDuWei_=inputDuDuWei;
me.inputFenDuWei_=inputFenDuWei;
me.inputMiaoDuWei_=inputMiaoDuWei;
me.point_=point;
map.getContainer().appendChild(container);
return container;
}
/**
* 设置控件的格式
*/
GRulerControl.prototype.setButtonStyle_ = function(button) {
button.style.backgroundImage = 'url(' + this.BACKGROUND_IMAGE_ + ')';
button.style.font = 'small Arial';
button.style.border = '1px solid #888888';
button.style.padding = '4px';
button.style.textAlign = 'right';
button.style.cursor = 'pointer';
}
/**
* 用恰当的格式表示距离
*/
GRulerControl.prototype.formatDistance_ = function(len) {
var me = this;
len = Math.round(len);
if (len <= 1000) {
return len + ' ' + me.METER_;
} else if (len <= 1000000) {
return len / 1000 + ' ' + me.KILOMETER_;
}
return Math.round(len / 1000) + ' ' + me.KILOMETER_;
}
/**
* 格式化角度为字符串
*/
GRulerControl.prototype.formatDegree_ = function(value) {
value = Math.abs(value);
var v1 = Math.floor(value);
var v2 = Math.floor((value - v1) * 60);
var v3 = Math.round((value - v1) * 3600 % 60);
return v1 + '°' + v2 + '\'' + v3 + '"';
}
/**
* 格式化经纬度为字符串
*/
GRulerControl.prototype.formatLatLng_ = function(pt) {
var me = this;
var latName, lngName;
var lat = pt.lat();
var lng = pt.lng();
latName = lat >= 0 ? '北纬' : '南纬';
lngName = lng >= 0 ? '东经' : '西经';
return lngName + me.formatDegree_(lng) + '，'
+ latName + me.formatDegree_(lat);
}
/**
* 返回控件的默认位置
*/
GRulerControl.prototype.getDefaultPosition = function() {
return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(8, 8));
}
/**
* 返回控件是否已启用
*/
GRulerControl.prototype.isEnabled = function() {
return this.enabled_;
}
/**
* 设置控件的“启用/禁用"状态
*/
GRulerControl.prototype.setEnabled = function(value) {
var me = this;
if (value == me.enabled_)
return;
me.enabled_ = value;
if (me.enabled_) {
me.mapClickHandle_ = GEvent.addListener(me.map_, 'click', me.onMapClick_);
me.txtInfo_.style.display = 'block';
me.btnReset_.style.display = 'inline';
me.btnEnable_.src = me.ENABLE_BUTTON_IMAGE_;
me.btnEnable_.title = me.ENABLE_BUTTON_TITLE_;
me.updateDistance_();
} else {
GEvent.removeListener(me.mapClickHandle_);
me.txtInfo_.style.display = 'none';
me.btnReset_.style.display = 'none';
me.btnEnable_.src = me.DISABLE_BUTTON_IMAGE_;
me.btnEnable_.title = me.DISABLE_BUTTON_TITLE_;
}
}
//输入小数格式的经纬度后定位
GRulerControl.prototype.DingWei=function(){
var me=this;
var point;
var newMarker;
if (me.jingduInput_.value!=""&&me.weiduInput_.value!="" )
{
point=new GLatLng(me.weiduInput_.value,me.jingduInput_.value);
if (point!=me.point_)
{
me.point_=point;
newMarker=new GMarker(point,{draggable: true});
me.map_.addOverlay(newMarker);
var pos = me.tail_.prev_;
newMarker.prev_ = pos;
newMarker.next_ = pos.next_;
pos.next_.prev_ = newMarker;
pos.next_ = newMarker;
// 为标记添加事件处理函数：拖拽标记时要更新连接线段和距离
GEvent.addListener(newMarker, 'dragend',
function() {
me.map_.closeInfoWindow();
me.updateSegments_(newMarker);
me.updateDistance_();
}
);
// 为标记添加事件处理函数：单击标记时要显示信息窗口
//GEvent.addListener(newMarker, 'click',
//function() {
newMarker.openInfoWindow(me.createInfoWindow_(newMarker));
// }
// );
// 将创建的标记添加到地图中
me.map_.addOverlay(newMarker);
if (newMarker.prev_ != me.head_) {
// 如果这不是第一个标记，则创建连接到上一个标记的线段，并显示在地图中
var segment = [newMarker.prev_.getLatLng(), point];
newMarker.segPrev_ = new GPolyline(segment);
newMarker.prev_.segNext_ = newMarker.segPrev_;
me.map_.addOverlay(newMarker.segPrev_);
// 更新距离显示
me.updateDistance_();
}
}
}
}
//输入角度格式成功后的经纬度后定位
GRulerControl.prototype.DingWeiDu=function(){
var me=this;
var point;
var newMarker;
var jingdu=me.convertBJiaoJing();
var weidu=me.convertBJiaoWei();
if (jingdu!=0&&weidu!=0 )
{
point=new GLatLng(weidu,jingdu);
if (point!=me.point_)
{
me.point_=point;
newMarker=new GMarker(point,{draggable: true});
me.map_.addOverlay(newMarker);
var pos = me.tail_.prev_;
newMarker.prev_ = pos;
newMarker.next_ = pos.next_;
pos.next_.prev_ = newMarker;
pos.next_ = newMarker;
// 为标记添加事件处理函数：拖拽标记时要更新连接线段和距离
GEvent.addListener(newMarker, 'dragend',
function() {
me.map_.closeInfoWindow();
me.updateSegments_(newMarker);
me.updateDistance_();
}
);
// 为标记添加事件处理函数：单击标记时要显示信息窗口
//GEvent.addListener(newMarker, 'click',
//function() {
newMarker.openInfoWindow(me.createInfoWindow_(newMarker));
// }
// );
// 将创建的标记添加到地图中
me.map_.addOverlay(newMarker);
if (newMarker.prev_ != me.head_) {
// 如果这不是第一个标记，则创建连接到上一个标记的线段，并显示在地图中
var segment = [newMarker.prev_.getLatLng(), point];
newMarker.segPrev_ = new GPolyline(segment);
newMarker.prev_.segNext_ = newMarker.segPrev_;
me.map_.addOverlay(newMarker.segPrev_);
// 更新距离显示
me.updateDistance_();
}
}
}
}
/**
* 事件处理函数：当用户单击地图时，要在该位置添加一个标记
*/
GRulerControl.prototype.onMapClick_ = function(marker, latlng) {
var me = this.rulerControl_;
// 如果用户单击的是标记，不再这里处理
if (marker)
return;
// 创建标记，并添加到链表中
var newMarker = new GMarker(latlng, {draggable: true});
var pos = me.tail_.prev_;
newMarker.prev_ = pos;
newMarker.next_ = pos.next_;
pos.next_.prev_ = newMarker;
pos.next_ = newMarker;
// 为标记添加事件处理函数：拖拽标记时要更新连接线段和距离
GEvent.addListener(newMarker, 'dragend',
function() {
me.map_.closeInfoWindow();
me.updateSegments_(newMarker);
me.updateDistance_();
}
);
// 为标记添加事件处理函数：单击标记时要显示信息窗口
GEvent.addListener(newMarker, 'click',
function() {
newMarker.openInfoWindow(me.createInfoWindow_(newMarker));
}
);
// 将创建的标记添加到地图中
me.map_.addOverlay(newMarker);
if (newMarker.prev_ != me.head_) {
// 如果这不是第一个标记，则创建连接到上一个标记的线段，并显示在地图中
var segment = [newMarker.prev_.getLatLng(), latlng];
newMarker.segPrev_ = new GPolyline(segment);
newMarker.prev_.segNext_ = newMarker.segPrev_;
me.map_.addOverlay(newMarker.segPrev_);
// 更新距离显示
me.updateDistance_();
}
}
/**
* 统计总距离，并显示在网页中
*/
GRulerControl.prototype.updateDistance_ = function() {
var me = this;
var len = me.getDistance();
// 结果显示在网页中
me.txtInfo_.innerHTML ="各测点之间总距离 "+me.formatDistance_(len);
}
/**
* 遍历链表，统计总距离
*/
GRulerControl.prototype.getDistance = function() {
var me = this;
var len = 0;
// 周游链表，累计相邻两个标记间的距离
for (var m = me.head_; m != me.tail_; m = m.next_) {
if (m.prev_ && m.prev_.getLatLng)
len += m.prev_.getLatLng().distanceFrom(m.getLatLng());
}
return len;
}
//进行经度和纬度的在线计算转换
GRulerControl.prototype.convert=function(){
var me=this;
var jingweidu;
var jwInt;
if(me.inputJingDu_.value!="")//小数格式中输入了值
{
jingweidu=me.inputJingDu_.value;
me.txtJW_.innerHTML="结果为:"+me.formatDegree_(jingweidu);
}
}
//将标准经纬度转换为小数。
GRulerControl.prototype.convertB=function(){
var me=this;
var du=0;
var fen=0;
var miao=0;
var chuohe=0;
if(me.inputDu_.value!="")
{ du=me.inputDu_.value;
}
else
du=0;
if(me.inputFen_.value!="")
{ fen=me.inputFen_.value;
}
else
fen=0;
if(me.inputMiao_.value!="")
{miao=me.inputMiao_.value;
}
else
miao=0;
chuohe=miao/60;
chuohe=Number(chuohe)+Number(fen);
chuohe=chuohe/60;
chuohe=Number(chuohe)+Number(du);
me.txtBiaoZhun_.innerHTML="";
me.txtBiaoZhun_.innerHTML="结果为:"+Math.round(chuohe*100000)/100000;
//在页面上添加标记
// var newMarker = new GMarker(latlng, {draggable: true});
}
//使用角度定位前，将标准经纬度转换为小数
GRulerControl.prototype.convertBJiaoJing=function(){
var me=this;
var du=0;
var fen=0;
var miao=0;
var chuohe=0;
if(me.inputDuDu_.value!="")
{ du=me.inputDuDu_.value;
}
else
du=0;
if(me.inputFenDu_.value!="")
{ fen=me.inputFenDu_.value;
}
else
fen=0;
if(me.inputMiaoDu_.value!="")
{miao=me.inputMiaoDu_.value;
}
else
miao=0;
chuohe=miao/60;
chuohe=Number(chuohe)+Number(fen);
chuohe=chuohe/60;
chuohe=Number(chuohe)+Number(du);
//me.txtBiaoZhun_.innerHTML="";
//me.txtBiaoZhun_.innerHTML="结果为:"+Math.round(chuohe*10000)/10000;
return Math.round(chuohe*100000)/100000;
}
//使用角度定位前，将标准经纬度转换为小数
GRulerControl.prototype.convertBJiaoWei=function(){
var me=this;
var du=0;
var fen=0;
var miao=0;
var chuohe=0;
if(me.inputDuDuWei_.value!="")
{ du=me.inputDuDuWei_.value;
}
else
du=0;
if(me.inputFenDuWei_.value!="")
{ fen=me.inputFenDuWei_.value;
}
else
fen=0;
if(me.inputMiaoDuWei_.value!="")
{miao=me.inputMiaoDuWei_.value;
}
else
miao=0;
chuohe=miao/60;
chuohe=Number(chuohe)+Number(fen);
chuohe=chuohe/60;
chuohe=Number(chuohe)+Number(du);
//me.txtBiaoZhun_.innerHTML="";
//me.txtBiaoZhun_.innerHTML="结果为:"+Math.round(chuohe*10000)/10000;
return Math.round(chuohe*100000)/100000;
}
/**
* 清除所有标记，初始化链表
*/
GRulerControl.prototype.reset = function() {
var me = this;
for (var m = me.head_.next_; m != me.tail_; m = m.next_) {
me.map_.removeOverlay(m);
if (m.segNext_)
me.map_.removeOverlay(m.segNext_);
}
me.head_ = new Object();
me.tail_ = new Object();
me.head_.next_ = me.tail_;
me.tail_.prev_ = me.head_;
me.updateDistance_();
}
/**
* 事件处理函数：当用户拖拽标记、标记坐标改变时被调用，这里要更新与该标记连接的线段
* @param {GMarker} marker 被拖拽的标记
*/
GRulerControl.prototype.updateSegments_ = function(marker) {
var me = this;
var segment;
// 更新连接前驱的线段
if (marker.segPrev_ && marker.prev_.getLatLng) {
// 从地图上删除旧的线段
me.map_.removeOverlay(marker.segPrev_);
// 根据标记的当前坐标构造新的线段，并更新链表结点的相关字段
segment = [marker.prev_.getLatLng(), marker.getLatLng()];
marker.segPrev_ = new GPolyline(segment);
marker.prev_.segNext_ = marker.segPrev_;
// 将新线段添加到地图中
me.map_.addOverlay(marker.segPrev_);
}
// 更新连接后继的线段，与上类似
if (marker.segNext_ && marker.next_.getLatLng) {
me.map_.removeOverlay(marker.segNext_);
segment = [marker.getLatLng(), marker.next_.getLatLng()];
marker.segNext_ = new GPolyline(segment);
marker.next_.segPrev_ = marker.segNext_;
me.map_.addOverlay(marker.segNext_);
}
}
/**
* 为信息窗口创建 DOM 对象，包括标记的坐标和“删除”按钮
* @param {GMarker} marker 对应的标记
*/
GRulerControl.prototype.createInfoWindow_ = function(marker) {
var me = this;
// 为气泡提示窗口创建动态 DOM 对象，这里我们用 DIV 标签
var div = document.createElement('div');
div.style.fontSize = '10.5pt';
div.style.width = '250px';
div.appendChild(
document.createTextNode(me.formatLatLng_(marker.getLatLng())));
var hr = document.createElement('hr');
hr.style.border = 'solid 1px #cccccc';
div.appendChild(hr);
// 创建“删除”按钮
var lnk = document.createElement('div');
lnk.innerHTML = me.DELETE_BUTTON_TITLE_;
lnk.style.color = '#0000cc';
lnk.style.cursor = 'pointer';
lnk.style.textDecoration = 'underline';
// 为“删除”按钮添加事件处理：调用 removePoint() 并重新计算距离
lnk.onclick =
function() {
me.map_.closeInfoWindow();
me.removePoint_(marker);
me.updateDistance_();
};
div.appendChild(lnk);
// 当用户关闭信息窗口时 Google 地图 API 会自动释放该对象
return div;
}
/**
* 事件处理函数：当用户选择删除标记时被调用，这里要删除与该标记连接的线段
* @param {GMarker} marker 要删除的标记
*/
GRulerControl.prototype.removePoint_ = function(marker) {
var me = this;
// 先从地图上删除该标记
me.map_.removeOverlay(marker);
// 对于中间结点，还要把它的前驱和后继用线段连接起来
if (marker.prev_.getLatLng && marker.next_.getLatLng) {
var segment = [marker.prev_.getLatLng(), marker.next_.getLatLng()];
var polyline = new GPolyline(segment);
marker.prev_.segNext_ = polyline;
marker.next_.segPrev_ = polyline;
me.map_.addOverlay(polyline);
}
marker.prev_.next_ = marker.next_;
marker.next_.prev_ = marker.prev_;
if (marker.segPrev_)
me.map_.removeOverlay(marker.segPrev_);
if (marker.segNext_)
me.map_.removeOverlay(marker.segNext_);
}