将路径方向缩放到段

时间:2014-06-09 01:38:38

标签: javascript dictionary esri segment arcgis-js-api

基本上我想在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

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

1 个答案:

答案 0 :(得分:0)

您的错误的根本原因在于您尝试获取不存在的.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的结果,但不幸的是,他们不会尝试提取compressedGeometry字段。

<小时/> 编辑:来自ESRI here的更多示例代码,以及C#/ Java / Python中的示例。