RangingTool 覆盖物文案国际化

概述

    当我们在使用RangingTool量尺的时候,第一个点会显示: 起点,第二个点显示: XX公里,第三个点显示:共XX公里. 当我们把地图设置为英文的时候,量尺对应的显示没有替换为英文,这是令我们苦恼的事情,如何解决问题,变成为我们的主要点.

问题分析

    试图在对应的API中去查找对应的属性来修改文案.一下便是我们找的三个属性,对应的上面三个显示文案.量尺API

RangingToolOptions 类型 说明
startLabelText String 设置量测起始点标签的文字内容,默认为“起点”
midLabelText String 设置量测中间点处标签的文字内容,默认为当前量测结果值
endLabelText String 设置量测结束点处标签的文字内容,默认为当前量测结果值

试图修改方式一

					new AMap.RangingTool(AmapFeature, {
                        startLabelText: "起点",
                        midLabelText: "中间点",
                        endLabelText: "末尾点"
                    });

结果发现, 三个点完全被我们重新设置点的文案覆盖了,达不到我们的需求,我们需要重新思考问题解决方案

试图修改方式二

当我们在看量尺属性API的时候,突然间看到有三个对应的监听函数,于是打印三个函数的返回结果.

事件 参数 说明
addnode {marker,positon,type} 每添加一个量测点时触发此事件,参数:marker:添加的标记点对position:添加的标记点坐标 type:事件类型为addnode
removenode {target,polyline,points,distance} 每删除一个量测点时触发此事件,参数:target:距离量测对象polyline:量测线对象points:量测点(LngLat)对象的集合distance:本次距离量测的总距离值,位默认为:公里
end {target,polyline,points,distance} 距离量测结束后触发此事件,参数:target:距离量测对象polyline:量测线对象 points:量测点(LngLat)对象的集合distance:本次距离量测的总距离值,单位默认为:公里

RangingTool 覆盖物文案国际化_第1张图片
RangingTool 覆盖物文案国际化_第2张图片
RangingTool 覆盖物文案国际化_第3张图片
我们发现在addnode监听方法中,找到了RangingTool对应的三个属性,根据对应的格式我们只需要做些改变便可.

	new AMap.RangingTool(AmapFeature, {
               startLabelText: that.$t('startingPoint')+"
", midLabelText: "{d}"+that.$t('kilometer')+"
", endLabelText: that.$t('total')+"{d}"+that.$t('kilometer')+"
" });

结束语

    以上的解决方式,便为我们做RangingTool国际化,提供了解决方案. 因此高德地图的功能有很多,故需要我们多去实践,多看相应的API.

你可能感兴趣的:(RangingTool 覆盖物文案国际化)