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:本次距离量测的总距离值,单位默认为：公里

我们发现在addnode监听方法中,找到了RangingTool对应的三个属性,根据对应的格式我们只需要做些改变便可.

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

结束语

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