第一次尝试 ArcGis

第一次在项目中尝试  ArcGis， 由于之前项目中就已经有了，这里基本是搬砖，没有 npm install 的过程。这里只是展示一些代码，让地图展现。

第一步：

　　当然是安装依赖啦，不过这次没涉及，以后补充。

第二步：

　　引入组件

import ArcGis from "businessComponent/mapFunc"
const GRAPHICS = [{
    name: "xzqOverLayer",
    id: "xzqOverLayer",
    layer: "FeatureLayer",
    url: COMPRE_ANALYSE_XZQOVER,
    visibility: true
}]
const Arcgis = ArcGis()

第三步：

　　调用。（这里的ArcGis，被深度分装过，所以有些不太适用，慢慢研究吧）

async componentDidMount() {
    const mapUrl = "http://30.99.137.128:6080"
    this.baseMapLayers = mapUrl + "arcgis/rest/services/PC_map_3857/MapServer"
    await Arcgis.init(
        this,
        { url: baseMapLayers, title: "delorme"}, //地址
        "Arcgis_map_id",  //元素的id
        {
            extent: { //不清楚这些数字的含义
                xmin: 12535988.013989875,
                ymin: 2486300.4995683962,
                xmax: 12913432.768878396,
                ymax: 2711852.950673299,
                spatialReference: { wkid: 102100}
            },
            basemap: "delorme",
            maxZoom: 16,
            minZoom: 9,
            zoom: window.screen.width <= 1280 ? 10: window.screen.width >= 1920 ? 11 : 10,
            center: [114.11832, 22.666651] //地图展现的位置
        },
        [{ url: baseMapLayers, id: "Arcgis_map_id"}]
    )
    Arcgis.AddGraphicLayer(GRAPHICS)
}

　　DOM部分：

render() {
    return (
        <div className="map">
            <div id="Arcgis_map_id"></div>
        </div>
    )
}
//.map  #Arcgis_map_id 都需要设置宽高