折线几何图形 - SimpleLineSymbol是唯一未在地图上显示的类型

时间:2015-10-05 12:30:47

标签: javascript graphics esri polyline arcgis-js-api

我修改了ESRI ArcGIS js API Measurement小部件,以保留用户所做测量的基于会话的历史记录。当用户单击历史记录项时,它应该将与该历史记录项关联的几何图形显示为地图上的GraphicsLayer。我正在使用knockout来管理历史记录项,并在单击历史记录项时检索测量元数据。

此时,我的多边形(用于区域)和点(用于位置)分别与SimpleFillSymbol()和SimpleMarkerSymbol()一起工作正常。但是,从距离测量返回的折线几何图形不会在使用SimpleLineSymbol()的地图上显示。

以下是代码:

var graphicLayerId = "measurementHistoryGraphicsLayer";

function addGraphicsLayerToMap(graphicsLayer) {
    var lay = getGraphicsLayerFromMap();
    if (lay !== undefined) {
        lay.clear();
        lay.add(graphicsLayer);
        map.removeLayer(lay);
    }
    map.addLayer(graphicsLayer);
}


function createGraphicFromGeometry(viewModel) {
    //Determine the symbol type
    var symbol;
    switch (viewModel.activeTool) {
        case "area":
            symbol = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_SOLID,
                                                      new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new esri.Color([255, 0, 0]), 2),
                                                      new esri.Color([255, 0, 0, 0.25]));
            break;
        case "distance":
            symbol = new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new esri.Color([255, 0, 0]), 3);
            break;
        case "location":
            symbol = new esri.symbol.SimpleMarkerSymbol(esri.symbol.SimpleMarkerSymbol.STYLE_SQUARE, 10,
                                                            new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new esri.Color([255, 0, 0]), 3),
                                                            new esri.Color([0, 255, 0, 0.25]));
            break;
    }
    var graphic = new esri.Graphic(viewModel.geometry, symbol, { "extent": viewModel.extent, "unitName": viewModel.unitName });
    return graphic;
}

function createGraphicsLayerFromGraphic(graphic) {
    var graphicLayer = new esri.layers.GraphicsLayer({ id: graphicLayerId });
    graphicLayer.add(graphic);
    graphicLayer.setRenderer(new esri.renderer.SimpleRenderer(graphic.symbol));
    return graphicLayer;
}

function getGraphicsLayerFromMap() {
    return map.getLayer(graphicLayerId);
}

$(document).on('click', '#emv_measurement_history .list-group-item', function () {
    $('#emv_measurement_history .list-group-item.list-group-item-info').removeClass('list-group-item-info');
    $(this).addClass('list-group-item-info');
    var measurementData = ko.mapping.toJS(ko.dataFor($(this)[0]));
    var graphic = createGraphicFromGeometry(measurementData);
    var graphicsLayer = createGraphicsLayerFromGraphic(graphic);
    addGraphicsLayerToMap(graphicsLayer);
    map.setExtent(measurementData.extent);
});

就像我说的,这适用于区域和位置,但距离似乎不起作用。我甚至尝试添加一个硬编码的折线值,从中创建一个SimpleLineSymbol但没有成功。

有关其他信息,请参阅折线信息:

[
    [
        [
            2591769.2297164765,
            5236836.417134136
        ],
        [
            2573584.2281166334,
            4620357.96034264
        ],
        [
            2557384.1428811993,
            4038303.8136230526
        ],
        [
            3124973.8484519687,
            4260007.60486125
        ],
        [
            3714518.451309448,
            4454862.77067183
        ],
        [
            4324318.833989203,
            4618552.510359674
        ],
        [
            4666465.839330839,
            4693607.843734423
        ],
        [
            5013294.285789721,
            4757423.375729576
        ]
    ]
]

空间参考设置为102100。

1 个答案:

答案 0 :(得分:0)

我终于明白了。

我将原始测量中的几何图形存储在挖空变量中。当我从中读取它时,它会很好地构建图形,符号和图形层,而不会抛出任何错误。

我发现由于某种原因,数据和空间参考不匹配,所以我从存储的几何体中提取路径,将其分配给新的折线变量,将空间参考重新设置为102100,就像我需要的那样,将几何图形重新分配给图形,这有效。

var g = new esri.Graphic(viewModel.geometry, symbol, { "extent": viewModel.extent, "unitName": viewModel.unitName });
if (viewModel.activeTool === "distance") {
    var polyline = new esri.geometry.Polyline(viewModel.geometry.paths);
    polyline.setSpatialReference(new esri.SpatialReference(102100));
    g.setGeometry(polyline);
}