Question

我使用sketchViewModel来编辑图层。我有下一个逻辑：

上传基本模型；
编辑模型；
将编辑模型保存到localStorage
从localStorage上载模型。

当我从本地存储上传模型并将其添加到graphicLayers时，出现错误：

[esri.core.Accessor] Accessor#set Invalid property value, value needs to be one of 
'esri.geometry.Extent', 'esri.geometry.Multipoint', 'esri.geometry.Point', 'esri.geometry.Polyline', 
'esri.geometry.Polygon', or a plain object that can autocast (having .type = 'extent', 'multipoint',
'point', 'polyline', 'polygon')

[esri.core.Accessor] Accessor#set Invalid property value, value needs to be one of 
'esri.symbols.SimpleFillSymbol', 'esri.symbols.PictureFillSymbol', 'esri.symbols.PictureMarkerSymbol', 
'esri.symbols.SimpleLineSymbol', 'esri.symbols.SimpleMarkerSymbol', 'esri.symbols.TextSymbol', 
'esri.symbols.LabelSymbol3D', 'esri.symbols.LineSymbol3D', 'esri.symbols.MeshSymbol3D', 
'esri.symbols.PointSymbol3D', 'esri.symbols.PolygonSymbol3D', 'esri.symbols.WebStyleSymbol', 
'esri.symbols.CIMSymbol', or a plain object that can autocast (having .type = 'simple-fill', 'picture-
fill', 'picture-marker', 'simple-line', 'simple-marker', 'text', 'label-3d', 'line-3d', 'mesh-3d', 
'point-3d', 'polygon-3d', 'web-style', 'cim')

这是我的代码：

sketchViewModel.on("update", checkGraphicUpdate);

function checkGraphicUpdate(evt) {
    if(evt.state === 'complete'){
        // dispatchRecentChanges(geometryGraphics);
        localStorage.setItem('features', geometryGraphics.toJSON())
    }
}

if(uploadView){
    graphicsLayer.removeAll();

    JSON.parse(localStorage.feautures).forEach(
        function(featureJson){
            graphicsLayer.add(new Graphic(featureJson))}
    );
}

这是LocalStorage中JSON中元素的示例：

{"geometry":{"spatialReference":{"wkid":4326},"paths":[[[-111.3, 52.68], [-98,
 49.5], [-93.94, 29.89]]]},"symbol":{"type":"esriSLS","color":
[0,255,0,255],"width":4,"style":"esriSLSSolid"},"attributes":
{"DATA_SOURSE":"3","AVERAGE_DEPTH":"1.2","MATERIAL":"14","PLACINGFORM":"2","MEAS
UREDLENGTH":"12.4","DIAMETER":"6","STREETNAME":"אבן 
עזרא","DIAMETERUNIT":"'אינצ","STATUS":"1","LOCATION":"13","INSTALLYEAR":"2018","
Title":"Water_Pipe_Section [F3FA]","PURPOSE":"1"},"popupTemplate":
{"popupElements":[{"type":"fields","fieldInfos":
[{"fieldName":"DATA_SOURSE","visible":true},
{"fieldName":"AVERAGE_DEPTH","visible":true},
{"fieldName":"MATERIAL","visible":true},
{"fieldName":"PLACINGFORM","visible":true},
{"fieldName":"MEASUREDLENGTH","visible":true},
{"fieldName":"DIAMETER","visible":true},
{"fieldName":"STREETNAME","visible":true},
{"fieldName":"DIAMETERUNIT","visible":true},
{"fieldName":"STATUS","visible":true},{"fieldName":"LOCATION","visible":true},
{"fieldName":"INSTALLYEAR","visible":true},{"fieldName":"Title","visible":true},
{"fieldName":"PURPOSE","visible":true}]}],"title":"{Title}"}}

我知道这是由于存储的数据中的错误所致。但是如何保存这些数据，然后正确提取呢？

Answer 1

发生此错误是因为geometry.type和symbol.type没有保存在JSON中。解决方案是检查if（（（data.symbol ['type'] ===“ esriSLS”））然后扩展新的Polyline（）并在新的Graphic（）中明确指定符号：{type：“ simple-line”}

代码：

if (data.symbol['type'] === "esriSLS") {

        const {type, fieldInfos} = popupElements[0],
            {paths} = geometry;

        const pLine = new Polyline({spatialReference, paths});

        const symbol = {
            type: "simple-line",
            width: width,
            color: color
        };

        return new Graphic({
            geometry: pLine,
            symbol: symbol,
            attributes: attributes,
            popupTemplate: {
                title: "{Title}",
                content: [{type, fieldInfos}]
            }
        });
    }

Answer 2

在上面的代码中，我不确定geometryGraphics是指图形数组还是单个图形。话虽如此，如果您有一个Graphic对象，则对其进行序列化/反序列化的最佳方法是使用toJSON()和fromJSON()。这样，您不必担心内部JSON表示形式。

var graphic = new Graphic({
  geometry: ...,
  symbol: ...,
  ...
});

var json = graphic.toJSON();

var newGraphic = Graphic.fromJSON(json);

无法保存然后还原图形

2 个答案: