将路线方向缩放到线段

Question

基本上，我在 OneMap 上获取方向时尝试缩放到某些路线段。这是我尝试绘制路线并缩放到特定路线段的 JavaScript 代码：

function getDirections() {
var routeData = new Route;
var from = document.getElementById('txtFrom').value
var to = document.getElementById('txtTo').value
//Draw out the line from the cordinate to another cordinate
routeData.routeStops = from + ";" + to;

//What type of mode will it do
routeData.routeMode = "DRIVE";
//can draw out untill the following coordiante
routeData.barriers = '36908.388637,35897.420831';
{
    if (document.getElementById('CbAvoid').checked) {
        routeData.avoidERP = "1";
    }
    else
        routeData.avoidERP = "0";
}
routeData.GetRoute(showRouteData)
}

function showRouteData(routeResults) {
    if (routeResults.results == "No results") {
        alert("No Route found, please try other location.")
        return
    }
    $('#divComputedDirection').show();
    directions = routeResults.results.directions[0];
    directionFeatures = directions.features;
    var routeSymbol = new esri.symbol.SimpleLineSymbol().setColor(new dojo.Color([0, 0, 255, 0.5])).setWidth(4);
    var mergedGeometry = new esri.geometry.Polyline()

    mergedGeometry.addPath(routeResults.results.routes.features[0].geometry.paths[0])
    OneMap.map.graphics.add(new esri.Graphic(mergedGeometry, routeSymbol));
    //Display the total time and distance of the route                   
    var htmlStr = "";
    htmlStr += "<img class='close-image' onclick='closeDirectionResultDIV();' alt='close' src='img/closeDirectionResult.png' />";
    htmlStr += "<span style='font-weight:bold;'><br /> &nbsp; Total distance: " + Math.round(directions.summary.totalLength) + "km" + "<br /> &nbsp; Total time: " + Math.round(directions.summary.totalTime) + "mins <br/></span>";

    document.getElementById("divComputedDirection").innerHTML = htmlStr;

    //List the directions and create hyperlinks for each route segment
    for (var i = 0; i < directions.features.length; i++) {
        var feature = directions.features[i]
        document.getElementById("divComputedDirection").innerHTML += '<a href="JavaScript:zoomToSegment(' + i + ')" style="font-size: 11px"><br>' + parseInt(parseInt(i) + 1) + ". " + feature.attributes.text + " (" + formatDistance(feature.attributes.length, "miles") + ", " + formatTime(feature.attributes.time) + ") " + '</a>';
    }
}

//Zoom to the appropriate segment when the user clicks a hyperlink in the directions list
function zoomToSegment(index) {
var segment = directionFeatures[index];
map.setExtent(segment.geometry.getExtent(), true);
if (!segmentGraphic) {
    segmentGraphic = map.graphics.add(new esri.Graphic(segment.geometry, segmentSymbol));
}
else {
    segmentGraphic.setGeometry(segment.geometry);
}

}

它确实绘制了路线并显示了所有方向。但是当我单击某个方向并缩放到分段时，它会向我抛出一条错误消息，即Uncaught TypeError: Cannot call method 'getExtent' of undefined。

我想知道为什么会这样。提前致谢。

Answer 1

您的错误的根本原因是您试图获取不存在的.geometry 属性的范围 - 这部分相对容易。我认为，问题在于您正在寻找旅程中每一段的几何形状，而 OneMap 的 RouteTask 的返回结果并没有直接为您提供。

整个路线的几何形状在

routeResults.results.routes.features[0].geometry.paths[0]

并且各个片段在值中采用 ESRI 的一种有趣的压缩格式：

routeResults.results.directions[x].features[y].compressedGeometry

这里有这种压缩格式的一些文档和 C# 代码：

http://resources.esri.com/help/9.3/arcgisengine/ArcObjects/esrinetworkanalyst/INACompactStreetDirection_CompressedGeometry.htm

如果您确实需要单个段的几何形状，将 C# 代码移植到 JS 应该相对容易。

OneMap 有一个完整的工作示例here，它展示了如何处理来自 RouteTask 的结果，但不幸的是，他们没有尝试提取压缩的几何字段。

---

编辑： 来自 ESRI here 的更多示例代码，以及 C#/Java/Python 中的示例。