Javascript 使用JS示例代码添加shapefile

我想将shapefile从文件夹添加到地图。我已经使用了JS示例代码，但它不适合我。它在响应中给出了错误，featurecollection。它没有进入请求块，所以我将其更改为esri请求，但代码仍然不工作

  var portalUrl = "https://www.arcgis.com";

          esriConfig.defaults.io.proxyUrl = "/proxy/";
          on(dojo.byId("uploadForm"), "change", function (event) {
            var fileName = event.target.value.toLowerCase();

          <!-- if (sniff("ie")) { //filename is full path in IE so extract the file name -->
              <!-- var arr = fileName.split("\\"); -->
              <!-- fileName = arr[arr.length - 1]; -->
            <!-- } -->
            if (fileName.indexOf(".zip") !== -1) {//is file a zip - if not notify user
              generateFeatureCollection(fileName);
            }
            else {
              alert("Add shapefile as .zip file");
            }
          });


          function generateFeatureCollection (fileName) {
            var name = fileName.split(".");
            name = name[0].replace("c:\\fakepath\\", "");

            var params = {
              'name': name,
              'targetSR': map.spatialReference,
              'maxRecordCount': 1000,
              'enforceInputFileSizeLimit': true,
              'enforceOutputJsonSizeLimit': true
            };

            //var extent = scaleUtils.getExtentForScale(map, 40000);
            var extent = esri.geometry.getExtentForScale(map, 40000);
            var resolution = extent.getWidth() / map.width;
            params.generalize = true;
            params.maxAllowableOffset = resolution;
            params.reducePrecision = true;
            params.numberOfDigitsAfterDecimal = 0;

                       var myContent = {
              'filetype': 'shapefile',
              'publishParameters': JSON.stringify(params),
              'f': 'json',
              //'callback.html': 'textarea'
            };

            esriRequest({
              url: portalUrl + '/sharing/rest/content/features/generate',
              content: myContent,
               form: dojo.byId('uploadForm'),
              handleAs: 'json',
              load: lang.hitch(this, function (response) {
                <!-- if (response.error) { -->
                  <!-- errorHandler(response.error); -->
                  <!-- return; -->
                <!-- } -->

                var layerName = response.FeatureCollection.layers[0].layerDefinition.name;

                addShapefileToMap(response.FeatureCollection);
              }),
             //error: lang.hitch(this, errorHandler)
            });
          }

          function addShapefileToMap (featureCollection) {

            var fullExtent;
            var layers = [];

            arrayUtils.forEach(featureCollection.layers, function (layer) {
              var infoTemplate = new InfoTemplate("Details", "${*}");
              var featureLayer = new FeatureLayer(layer, {
                infoTemplate: infoTemplate
              });

              featureLayer.on('click', function (event) {
                map.infoWindow.setFeatures([event.graphic]);
              });
              changeRenderer(featureLayer);
              fullExtent = fullExtent ?
                fullExtent.union(featureLayer.fullExtent) : featureLayer.fullExtent;
              layers.push(featureLayer);
            });
            map.addLayers(layers);
            map.setExtent(fullExtent.expand(1.25), true);

          }

          function changeRenderer (layer) {
            //change the default symbol for the feature collection for polygons and points
            var symbol = null;
            switch (layer.geometryType) {
              case 'esriGeometryPoint':
                symbol = new PictureMarkerSymbol({
                  'angle': 0,
                  'xoffset': 0,
                  'yoffset': 0,
                  'type': 'esriPMS',
                  'url': 'https://static.arcgis.com/images/Symbols/Shapes/BluePin1LargeB.png',
                  'contentType': 'image/png',
                  'width': 20,
                  'height': 20
                });
                break;
              case 'esriGeometryPolygon':
                symbol = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID,
                  new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,
                    new Color([112, 112, 112]), 1), new Color([136, 136, 136, 0.25]));
                break;
            }
            if (symbol) {
              layer.setRenderer(new SimpleRenderer(symbol));
            }

}

var portalUrl=”https://www.arcgis.com";
esriConfig.defaults.io.proxyUrl=“/proxy/”；
on（dojo.byId（“uploadForm”），“change”，函数（事件）{
var fileName=event.target.value.toLowerCase（）；
if（fileName.indexOf（“.zip”）！==-1）{//是一个zip文件-如果不是，通知用户
generateFeatureCollection（文件名）；
}
否则{
警报（“将shapefile添加为.zip文件”）；
}
});
函数generateFeatureCollection（文件名）{
var name=fileName.split（“.”）；
名称=名称[0]。替换（“c:\\fakepath\\”，“”）；
变量参数={
“名称”：名称，
“targetSR”：map.spatialReference，
“maxRecordCount”：1000，
“enforceInputFileSizeLimit”：true，
“enforceOutputJsonSizeLimit”：真
};
//var extent=scaleUtils.getExtentForScale（映射，40000）；
var区段=esri.geometry.getExtentForScale（映射，40000）；
var resolution=extent.getWidth（）/map.width；
params.generalize=true；
params.maxAllowableOffset=分辨率；
params.reducePrecision=true；
params.numberOfDigitsAfterDecimal=0；
var myContent={
“文件类型”：“shapefile”，
“publishParameters”：JSON.stringify（params），
‘f’：‘json’，
//'callback.html'：'textarea'
};
电子请求({
url:portalUrl+'/sharing/rest/content/features/generate'，
内容：myContent，
表单：dojo.byId（'uploadForm'），
handleAs:'json'，
加载：lang.hitch（此，功能（响应）{
var layerName=response.FeatureCollection.layers[0].layerDefinition.name；
addShapefileToMap（response.FeatureCollection）；
}),
//错误：lang.hitch（此为errorHandler）
});
}
函数addShapefileToMap（功能集合）{
var全范围；
var层=[]；
arrayUtils.forEach（featureCollection.layers，函数（层）{
var infoTemplate=新的infoTemplate（“详细信息”，“${*}”）；
var featureLayer=新的featureLayer（图层{
infoTemplate:infoTemplate
});
featureLayer.on（'click'，函数（事件）{
map.infoWindow.setFeatures（[event.graphic]）；
});
changeRenderer（featureLayer）；
全域=全域？
联合（featureLayer.fullExtent）：featureLayer.fullExtent；
图层。推送（featureLayer）；
});
添加图层（图层）；
map.setExtent（fullExtent.expand（1.25），true）；
}
函数更改渲染器（层）{
//更改多边形和点的要素集合的默认符号
var符号=null；
开关（layer.geometryType）{
案例“ESRIGEMETRYPOINT”：
symbol=新图片标记symbol({
“角度”：0，
“xoffset”：0，
“yoffset”：0，
“类型”：“ESRIMPS”，
“url”：”https://static.arcgis.com/images/Symbols/Shapes/BluePin1LargeB.png',
“contentType”：“image/png”，
“宽度”：20，
身高：20
});
打破
案例“ESRIGEMETRYPOLYGON”：
symbol=新的SimpleFillSymbol（SimpleFillSymbol.STYLE\u实体，
新SimpleLineSymbol（SimpleLineSymbol.STYLE_SOLID，
新颜色（[112112112]），1），新颜色（[1361360.25]）；
打破
}
如果（符号）{
setRenderer（新的SimpleRenderer（符号））；
}
}

好吧，我检查了您的JSFIDLE和ATTED代码，发现其中少了几项-

重要链接和js库

dojo/esri组件需要

用于显示形状文件的贴图元素

映射控件html以加载映射元素

下面是工作代码（试试这个）——

var映射；
要求([
“esri/config”，
“esri/InfoTemplate”，
“esri/map”，
“esri/请求”，
“esri/几何体/标度”，
“esri/图层/功能图层”，
“esri/渲染器/简单渲染器”，
“esri/symbols/PictureMarkerSymbol”，
“esri/symbols/SimpleFillSymbol”，
“esri/symbols/SimpleLineSymbol”，
“dojo/dom”，
“dojo/json”，
“dojo/on”，
“dojo/parser”，
“dojo/sniff”，
“dojo/_基/阵列”，
“esri/Color”，
“dojo/_base/lang”，
“dijit/layout/BorderContainer”，
“dijit/layout/ContentPane”，
“dojo/domReady！”
],
作用(
esriConfig、信息模板、映射、请求、缩放、FeatureLayer、，
SimpleRenderer，PictureMarkerSymbol，SimpleFillSymbol，SimpleLineSymbol，
dom、JSON、on、解析器、嗅探、arrayUtils、颜色、语言
) {
parser.parse（）；
var portalUrl=”https://www.arcgis.com";
esriConfig.defaults.io.proxyUrl=“/proxy/”；
on（dojo.byId（“uploadForm”），“change”，函数（事件）{
var fileName=event.target.value.toLowerCase（）；
如果（fileName.indexOf（“.zip”）！==-1）{//文件是zip-i吗