arcgis for js4.x自定义Graphic数组创建FeatureLayer添加标注

一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第4天，点击查看活动详情。

导语

一般情况下FeatureLayer都是直接引用的url 这样很容易能拿到信息 添加标注，当给自己建立的Graphic添加标注时 就有些费劲了 标注不支持直接给Graphic加 所以需要将Graphic加到FeatureLayer里 下面我列了下方法

代码

var point = [{//第一个点
    "geometry": {
            "x": 116.820688,//点x坐标
            "y": 33.974053,//点Y坐标
            "spatialReference": {
                    "wkid": 4326
            }
    },
    "attributes": {
            //常用的字段可以在这里加 根据需求 不限定字段
            "cxcd": "监测站",
            "name": "相山区管网监测站",
            "pop": "4000",
            "x": "116.820688",
            "y": "33.974053"
    },
}, {//第二个点
    "geometry": {
            "x": 116.855988,
            "y": 34.064053,
            "spatialReference": {
                    "wkid": 4326
            }
    },
    "attributes": {
            "cxcd": "监测站",
            "name": "杜集区管网监测站",
            "pop": "4000",
            "x": "116.855988",
            "y": "34.064053"
    },
}, {
    "geometry": {
            "x": 116.850688,
            "y": 33.854053,
            "spatialReference": {
                    "wkid": 4326
            }
    },
    "attributes": {
            "cxcd": "监测站",
            "name": "烈山区管网监测站",
            "pop": "4000",
            "x": "116.850688",
            "y": "33.854053"
    },
}, {//第四个点
    "geometry": {
            "x": 116.600688,
            "y": 33.704053,
            "spatialReference": {
                    "wkid": 4326
            }
    },
    "attributes": {
            "cxcd": "监测站",
            "name": "濉溪县管网监测站#1",
            "pop": "4000",
            "x": "116.600688",
            "y": "33.704053"
    },
}, {
    "geometry": {
            "x": 116.700688,
            "y": 33.90053,
            "spatialReference": {
                    "wkid": 4326
            }
    },
    "attributes": {
            "cxcd": "监测站",
            "name": "濉溪县管网监测站#3",
            "pop": "4000",
            "x": "116.700688",
            "y": "33.90053"
    },
}, {
    "geometry": {
            "x": 116.800688,
            "y": 33.604053,
            "spatialReference": {
                    "wkid": 4326
            }
    },
    "attributes": {
            "cxcd": "监测站",
            "name": "濉溪县管网监测站#2",
            "pop": "4000",
            "x": "116.800688",
            "y": "33.604053"
    },
}];
//创建一个数组
var gras = [];
//循环将点信息添加进来
for (var i = 0; i < point.length; i++) {
    gras.push(new Graphic({
            geometry: new Point({
                    longitude: point[i].geometry.x,
                    latitude: point[i].geometry.y
            }),
            attributes: point[i].attributes
    }))
}
var Symbol1 = {
    type: "picture-marker",//类型
    url: 'img/fz.gif', //图片地址
    width: "110px",//宽
    height: "110px",//高
};
var renderer = {
    type: "class-breaks",
    field: "pop",
    classBreakInfos: [{
            minValue: 4000,
            maxValue: 7000,
            symbol: Symbol1
    }]
};
var fields = [{
    name: "ObjectID",
    alias: "ObjectID",
    type: "oid",
}];

for (var col in gras[0]["attributes"]) {
    fields.push({
            name: col,
            alias: col,
            type: "string"
    })
}
//标注
const nameClass0 = {
    labelPlacement: "center-along",
    labelExpressionInfo: {
            expression: "$feature.name"
    },
};
//创建了一个自定义FeatureLayer
var layerzz = new FeatureLayer({
    source: gras,
    renderer: renderer,
    geometryType: "point",
    fields: fields,
    objectIdField: "ObjectID",
    //添加标注信息 这里是重点
    labelingInfo: [
        nameClass0
    ],
});
map.add(layerzz);

每天进步亿点点！！！