我使用OS OpenData Map Builder绘制了一个使用openlayers的地图，我认为它必须是openlayers 2，因为api文件不同。
这是一个非常简单的例子，但我想计算路线的距离。在openlayers3中，这似乎可以按照OpenLayers 3: How to calculate distance between 2 points?
进行但这些方法不可用。我的另一个想法是将该功能保存到gpx，然后使用gpx查看器，我保存为gpx，但似乎无法在任何类型的gpx查看器中查看尽管文件正常但保存的点。
正如我所说，这是一个使用开放空间地图构建器的非常简单的示例。任何帮助/建议非常感谢。感谢。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Open Space Web-Map builder Code</title>
<!-- Download OpenSpace API using your key -->
<script type="text/javascript" src="https://openspace.ordnancesurvey.co.uk/osmapapi/openspace.js?key=BA08531D8339984EE0405F0AC86026A9"></script>
<script type= "text/javascript" src="https://openspace.ordnancesurvey.co.uk/osmapapi/script/mapbuilder/basicmap.js"></script>
<script type= "text/javascript" src="https://openspace.ordnancesurvey.co.uk/osmapapi/script/mapbuilder/searchbox.js"></script>
<script type="text/javascript">
//variables for routes
var linesLayer, points, lineFeature, lineString, routeMarkersLayer, routepos, routesize, routeoffset, routeicon;
var style_blue = {strokeColor: "#0000CD", strokeOpacity: 0.5, strokeWidth: 4.5};
function initmapbuilder()
{
//initiate the map
var options = {resolutions: [2500, 1000, 500, 200, 100, 50, 25, 10, 5, 4, 2.5, 2, 1]};
osMap = new OpenSpace.Map('map', options);
//configure map options (basicmap.js)
setglobaloptions();
//set the center of the map and the zoom level
osMap.setCenter(new OpenSpace.MapPoint(318105,500435),8);
linesLayer = osMap.getVectorLayer();
// Set up layer for route markers
routeMarkersLayer = new OpenLayers.Layer.Markers("Route Markers");
//make a route
points = new Array();
points.push(new OpenLayers.Geometry.Point(319025,500970));
points.push(new OpenLayers.Geometry.Point(319320,500995));
points.push(new OpenLayers.Geometry.Point(319410,500995));
points.push(new OpenLayers.Geometry.Point(319515,500950));
points.push(new OpenLayers.Geometry.Point(319725,500940));
points.push(new OpenLayers.Geometry.Point(319870,500930));
points.push(new OpenLayers.Geometry.Point(320085,500915));
points.push(new OpenLayers.Geometry.Point(320265,501110));
points.push(new OpenLayers.Geometry.Point(320355,501220));
points.push(new OpenLayers.Geometry.Point(320435,501310));
points.push(new OpenLayers.Geometry.Point(320500,501465));
points.push(new OpenLayers.Geometry.Point(320565,501590));
points.push(new OpenLayers.Geometry.Point(320640,501750));
points.push(new OpenLayers.Geometry.Point(320715,501905));
points.push(new OpenLayers.Geometry.Point(320755,502005));
points.push(new OpenLayers.Geometry.Point(320790,502175));
points.push(new OpenLayers.Geometry.Point(320810,502430));
points.push(new OpenLayers.Geometry.Point(320815,502605));
points.push(new OpenLayers.Geometry.Point(320775,502725));
points.push(new OpenLayers.Geometry.Point(320720,502820));
points.push(new OpenLayers.Geometry.Point(320665,502960));
points.push(new OpenLayers.Geometry.Point(320640,503130));
points.push(new OpenLayers.Geometry.Point(320625,503320));
points.push(new OpenLayers.Geometry.Point(320650,503475));
points.push(new OpenLayers.Geometry.Point(320710,503600));
points.push(new OpenLayers.Geometry.Point(320810,503795));
points.push(new OpenLayers.Geometry.Point(320835,503950));
points.push(new OpenLayers.Geometry.Point(320870,504040));
points.push(new OpenLayers.Geometry.Point(320705,503935));
points.push(new OpenLayers.Geometry.Point(320570,503790));
points.push(new OpenLayers.Geometry.Point(320540,503705));
points.push(new OpenLayers.Geometry.Point(320470,503635));
points.push(new OpenLayers.Geometry.Point(320385,503525));
points.push(new OpenLayers.Geometry.Point(320280,503395));
points.push(new OpenLayers.Geometry.Point(320225,503270));
points.push(new OpenLayers.Geometry.Point(320215,503140));
points.push(new OpenLayers.Geometry.Point(320200,503020));
points.push(new OpenLayers.Geometry.Point(320145,502910));
points.push(new OpenLayers.Geometry.Point(320050,502810));
points.push(new OpenLayers.Geometry.Point(319915,502670));
points.push(new OpenLayers.Geometry.Point(319815,502570));
points.push(new OpenLayers.Geometry.Point(319715,502500));
points.push(new OpenLayers.Geometry.Point(319490,502450));
points.push(new OpenLayers.Geometry.Point(319435,502315));
points.push(new OpenLayers.Geometry.Point(319385,502190));
points.push(new OpenLayers.Geometry.Point(319360,502120));
points.push(new OpenLayers.Geometry.Point(319270,502020));
points.push(new OpenLayers.Geometry.Point(319190,501970));
points.push(new OpenLayers.Geometry.Point(319130,501895));
points.push(new OpenLayers.Geometry.Point(318990,501985));
points.push(new OpenLayers.Geometry.Point(318910,502050));
points.push(new OpenLayers.Geometry.Point(318855,502075));
points.push(new OpenLayers.Geometry.Point(318750,502010));
points.push(new OpenLayers.Geometry.Point(318720,502045));
points.push(new OpenLayers.Geometry.Point(318640,501990));
points.push(new OpenLayers.Geometry.Point(318525,501935));
points.push(new OpenLayers.Geometry.Point(318410,501895));
points.push(new OpenLayers.Geometry.Point(318285,501850));
points.push(new OpenLayers.Geometry.Point(318220,501815));
points.push(new OpenLayers.Geometry.Point(318215,501725));
points.push(new OpenLayers.Geometry.Point(318160,501660));
points.push(new OpenLayers.Geometry.Point(318060,501545));
points.push(new OpenLayers.Geometry.Point(317990,501505));
points.push(new OpenLayers.Geometry.Point(317940,501525));
points.push(new OpenLayers.Geometry.Point(317870,501410));
points.push(new OpenLayers.Geometry.Point(317845,501330));
points.push(new OpenLayers.Geometry.Point(317800,501230));
points.push(new OpenLayers.Geometry.Point(317650,501115));
points.push(new OpenLayers.Geometry.Point(317630,501235));
points.push(new OpenLayers.Geometry.Point(317650,501435));
points.push(new OpenLayers.Geometry.Point(317675,501555));
points.push(new OpenLayers.Geometry.Point(317690,501700));
points.push(new OpenLayers.Geometry.Point(317660,501820));
points.push(new OpenLayers.Geometry.Point(317525,501895));
points.push(new OpenLayers.Geometry.Point(317490,501875));
points.push(new OpenLayers.Geometry.Point(317415,501860));
points.push(new OpenLayers.Geometry.Point(317365,501880));
points.push(new OpenLayers.Geometry.Point(317320,501840));
points.push(new OpenLayers.Geometry.Point(317265,501745));
points.push(new OpenLayers.Geometry.Point(317215,501625));
points.push(new OpenLayers.Geometry.Point(317185,501585));
points.push(new OpenLayers.Geometry.Point(317145,501575));
points.push(new OpenLayers.Geometry.Point(317100,501485));
points.push(new OpenLayers.Geometry.Point(317075,501435));
points.push(new OpenLayers.Geometry.Point(316955,501440));
points.push(new OpenLayers.Geometry.Point(316900,501360));
points.push(new OpenLayers.Geometry.Point(316890,501270));
points.push(new OpenLayers.Geometry.Point(316845,501205));
points.push(new OpenLayers.Geometry.Point(316790,501130));
points.push(new OpenLayers.Geometry.Point(316765,501075));
points.push(new OpenLayers.Geometry.Point(316700,501015));
points.push(new OpenLayers.Geometry.Point(316640,500970));
points.push(new OpenLayers.Geometry.Point(316590,500915));
points.push(new OpenLayers.Geometry.Point(316490,500865));
points.push(new OpenLayers.Geometry.Point(316380,500960));
points.push(new OpenLayers.Geometry.Point(316280,501070));
points.push(new OpenLayers.Geometry.Point(316260,501185));
points.push(new OpenLayers.Geometry.Point(316165,501205));
points.push(new OpenLayers.Geometry.Point(316050,501155));
points.push(new OpenLayers.Geometry.Point(315895,501125));
points.push(new OpenLayers.Geometry.Point(315775,501080));
points.push(new OpenLayers.Geometry.Point(315760,501030));
points.push(new OpenLayers.Geometry.Point(315755,500930));
points.push(new OpenLayers.Geometry.Point(315720,500885));
points.push(new OpenLayers.Geometry.Point(315600,500870));
points.push(new OpenLayers.Geometry.Point(315465,500805));
points.push(new OpenLayers.Geometry.Point(315395,500860));
points.push(new OpenLayers.Geometry.Point(315345,500710));
points.push(new OpenLayers.Geometry.Point(315310,500675));
points.push(new OpenLayers.Geometry.Point(315250,500675));
points.push(new OpenLayers.Geometry.Point(315180,500645));
points.push(new OpenLayers.Geometry.Point(315090,500560));
points.push(new OpenLayers.Geometry.Point(314975,500495));
points.push(new OpenLayers.Geometry.Point(314900,500430));
points.push(new OpenLayers.Geometry.Point(314790,500350));
points.push(new OpenLayers.Geometry.Point(314910,500295));
points.push(new OpenLayers.Geometry.Point(315025,500220));
points.push(new OpenLayers.Geometry.Point(315120,500130));
points.push(new OpenLayers.Geometry.Point(315185,500125));
points.push(new OpenLayers.Geometry.Point(315250,500070));
points.push(new OpenLayers.Geometry.Point(315430,499845));
points.push(new OpenLayers.Geometry.Point(315605,500010));
points.push(new OpenLayers.Geometry.Point(315725,500025));
points.push(new OpenLayers.Geometry.Point(315795,499985));
points.push(new OpenLayers.Geometry.Point(315910,499925));
points.push(new OpenLayers.Geometry.Point(316035,499920));
points.push(new OpenLayers.Geometry.Point(316225,499945));
points.push(new OpenLayers.Geometry.Point(316470,500015));
points.push(new OpenLayers.Geometry.Point(316630,500025));
points.push(new OpenLayers.Geometry.Point(316755,500005));
points.push(new OpenLayers.Geometry.Point(317170,500050));
points.push(new OpenLayers.Geometry.Point(317300,500125));
points.push(new OpenLayers.Geometry.Point(317365,500175));
points.push(new OpenLayers.Geometry.Point(317490,500115));
points.push(new OpenLayers.Geometry.Point(317575,500055));
points.push(new OpenLayers.Geometry.Point(317730,500065));
points.push(new OpenLayers.Geometry.Point(317820,500090));
points.push(new OpenLayers.Geometry.Point(317930,500015));
points.push(new OpenLayers.Geometry.Point(318175,500085));
points.push(new OpenLayers.Geometry.Point(318270,500165));
points.push(new OpenLayers.Geometry.Point(318380,500190));
points.push(new OpenLayers.Geometry.Point(318445,500280));
points.push(new OpenLayers.Geometry.Point(318705,500340));
points.push(new OpenLayers.Geometry.Point(318795,500350));
points.push(new OpenLayers.Geometry.Point(318845,500350));
points.push(new OpenLayers.Geometry.Point(318830,500440));
points.push(new OpenLayers.Geometry.Point(318895,500470));
points.push(new OpenLayers.Geometry.Point(318915,500555));
points.push(new OpenLayers.Geometry.Point(318900,500605));
points.push(new OpenLayers.Geometry.Point(318950,500615));
points.push(new OpenLayers.Geometry.Point(318980,500700));
points.push(new OpenLayers.Geometry.Point(319005,500750));
points.push(new OpenLayers.Geometry.Point(318945,500750));
points.push(new OpenLayers.Geometry.Point(318955,500830));
points.push(new OpenLayers.Geometry.Point(318930,500875));
points.push(new OpenLayers.Geometry.Point(319025,500970));
// create a polyline feature from the array of points
lineString = new OpenLayers.Geometry.LineString(points);
lineFeature = new OpenLayers.Feature.Vector(lineString, null, style_blue);
linesLayer.addFeatures([lineFeature]);
//console.log(lineString.getCoordinates())
//text = new OpenLayers.Format.GPX();
//gpxStr = text.write(lineFeature, null);
//console.log(gpxStr);
//crate a route start/end marker
routepos = new OpenSpace.MapPoint(319025,500970);
routesize = new OpenLayers.Size(33,45);
routeoffset = new OpenLayers.Pixel(-5,-37);
routeicon = new OpenSpace.Icon('https://openspace.ordnancesurvey.co.uk/osmapapi/img_versions/img_1.1/mapbuilder/routemarker-startend.png', routesize, routeoffset, null, null);
routeMarkersLayer.addMarker(new OpenLayers.Marker(routepos, routeicon));
osMap.addLayer(routeMarkersLayer);}
</script>
</head>
<body onload="initmapbuilder()">
<div id="map" style="border: 1px solid black; width:940px; height:840px;"></div>
</body>
</html>