Skip to content

场景说明

以某区域长势数据为例,按照接口核心流程调取接口

接口的请求头统一为,ServiceKey 和 UserName 的获取请看入门指南

属性说明例如是否必填
ServiceKey密钥f35a*********e5680b8必填
UserName用户名156****1376必填

1. 调取时间轴接口

js
// 请求:
axios.get(
  'https://gw.datall.cn/productapi/jh-api/cropndviRegionApi/queryTimeAxisInfoBetweenDate',
  {
    params: {
      regionId: 71041718850749,
      cropId: 102
    }
  }
);
json
// 返回结果
{
  "flag": true,
  "code": null,
  "msg": null,
  "data": [
    {
      "dataTime": "2021-06-15",
      "layerName": "JH_PRODUCT:ly_DST-HB-ZJKS_1719444224893_SummerCorn_20210615_S2_10M_grow_tif_rankid-1",
      "regionId": null,
      "regionCode": "DST-HB-ZJKS-YX",
      "dictCropId": null,
      "dictDatasetId": null,
      "regionMinMaxPoint": "114.1914569701847,39.55500099601528,115.0638879039279,40.19755534804155",
      "layerMinMaxPoint": "",
      "thumbnailUrl": "https://gw.datall.cn/productapi/jh-api/geoserverApi/getAnimateThumbnail?layerName=JH_PRODUCT:ly_DST-HB-ZJKS_1719444224893_SummerCorn_20210615_S2_10M_grow_tif_rankid-1&regionCode=DST-HB-ZJKS-YX&BBOX=114.1914569701847,39.55500099601528,115.0638879039279,40.19755534804155&ServiceKey=1c3a0eeaafe6bbb44078bb0c2295b92b&UserName=19999999999",
      "rankId": 1,
      "landId": null,
      "list": null,
      "bbox": "114.1914569701847,39.55500099601528,115.0638879039279,40.19755534804155"
    }
    // ...
  ]
}

2. 渲染瓦片图层

以 openlayers 为例,使用刚才时间轴接口中的第一期数据,加载瓦片图层在地图上

js
import Map from 'ol/Map.js';
import TileLayer from 'ol/layer/WebGLTile.js';
import TileWMS from 'ol/source/TileWMS.js';
import View from 'ol/View.js';

const layers = [
  new TileLayer({
    source: new TileWMS({
      url: 'https://gw.datall.cn/productapi/jh-api/geoserverApi/wms',
      params: {
        LAYERS:
          'JH_PRODUCT:ly_DST-HB-ZJKS_1719444224893_SummerCorn_20210615_S2_10M_grow_tif_rankid-1',
        VERSION: '1.1.0',
        FORMAT: 'image/png',
        ServiceKey: 'f35a*************e5680b8',
        UserName: '156****1376'
      }
    })
  })
];
const map = new Map({
  layers: layers,
  target: 'map',
  view: new View({
    zoom: 4
    // ...
  })
});

3. 调取图例接口

js
// 请求
axios.get(
  'https://gw.datall.cn/productapi/jh-api/cropndviRegionApi/queryStandard'
);

返回结果中,maxColor 为分级颜色,levelName 为分级名称

json
// 返回结果
{
  "flag": true,
  "code": null,
  "msg": null,
  "data": [
    {
      "id": 6,
      "datasetId": 10040,
      "levelName": "很差",
      "min": null,
      "max": 0.07,
      "unit": null,
      "orderNo": 1,
      "minColor": "#A70024",
      "maxColor": "#A70024",
      "datasetName": "长势"
    }
    // ...
  ]
}

4. 调取接口,渲染图表

使用刚才时间轴接口中的第一期数据,获取当前区域长势分级数据

js
// 请求:
axios.get(
  'https://gw.datall.cn/productapi/jh-api/cropndviRegionApi/queryRealtimeDataNew',
  {
    params: {
      regionId: 71041718850749,
      cropId: 102,
      dataTime: '2021-06-15'
    }
  }
);

返回结果为当前区域各分级对应的面积,其中 areaNum 为面积,单位为亩,tenThousandAreaNum 单位为万亩

json
{
  "flag": true,
  "code": null,
  "msg": null,
  "data": {
    "regionId": 71041718850749,
    "datatime": "2021-06-15",
    "cropId": 102,
    "regionChinaName": "蔚县",
    "regionEnglishName": "yuxian",
    "cropName": "夏玉米",
    "levelDataVos": [
      {
        "regionId": null,
        "levelId": 12,
        "areaNum": 221714.76,
        "numberOfPlants": null,
        "levelName": "很差",
        "sortNo": 1,
        "cropId": null,
        "cropName": null,
        "dataTime": null,
        "colorCode": "#E8AF64",
        "tenThousandAreaNum": 22.171476
      },
      {
        "regionId": null,
        "levelId": 18,
        "areaNum": 253618.94,
        "numberOfPlants": null,
        "levelName": "差",
        "sortNo": 2,
        "cropId": null,
        "cropName": null,
        "dataTime": null,
        "colorCode": "#D1B54D",
        "tenThousandAreaNum": 25.361894
      },
      {
        "regionId": null,
        "levelId": 13,
        "areaNum": 20433.63,
        "numberOfPlants": null,
        "levelName": "较差",
        "sortNo": 3,
        "cropId": null,
        "cropName": null,
        "dataTime": null,
        "colorCode": "#B6BA36",
        "tenThousandAreaNum": 2.043363
      },
      {
        "regionId": null,
        "levelId": 14,
        "areaNum": 10288.26,
        "numberOfPlants": null,
        "levelName": "中等",
        "sortNo": 4,
        "cropId": null,
        "cropName": null,
        "dataTime": null,
        "colorCode": "#83A624",
        "tenThousandAreaNum": 1.028826
      },
      {
        "regionId": null,
        "levelId": 15,
        "areaNum": 3029.7,
        "numberOfPlants": null,
        "levelName": "较好",
        "sortNo": 5,
        "cropId": null,
        "cropName": null,
        "dataTime": null,
        "colorCode": "#508F15",
        "tenThousandAreaNum": 0.30297
      },
      {
        "regionId": null,
        "levelId": 16,
        "areaNum": 186.48,
        "numberOfPlants": null,
        "levelName": "好",
        "sortNo": 6,
        "cropId": null,
        "cropName": null,
        "dataTime": null,
        "colorCode": "#267A0A",
        "tenThousandAreaNum": 0.018648
      },
      {
        "regionId": null,
        "levelId": 17,
        "areaNum": 0.0,
        "numberOfPlants": null,
        "levelName": "很好",
        "sortNo": 7,
        "cropId": null,
        "cropName": null,
        "dataTime": null,
        "colorCode": "#006600",
        "tenThousandAreaNum": 0.0
      }
    ],
    "meanOfLevelVos": null,
    "cropStatistics": null,
    "areaNum": 509271.77,
    "numberOfPlants": 0,
    "title": null,
    "option": null,
    "landId": null,
    "levelId": null,
    "tenThousandAreaNum": 50.927177,
    "m": null
  }
}

使用 echarts 插件渲染后得到图表

An image

使用刚才时间轴接口中的第一期数据,获取下级区域长势分级数据

js
// 请求:
axios.get(
  'https://gw.datall.cn/productapi/jh-api/cropndviRegionApi/queryRealtimeDataNextRegionNew',
  {
    params: {
      regionId: 71041718850749,
      cropId: 102,
      dataTime: '2021-06-15'
    }
  }
);

返回结果为下级区域各分级对应的面积,其中 areaNum 为面积,单位为亩,tenThousandAreaNum 单位为万亩

json
{
  "flag": true,
  "code": null,
  "msg": null,
  "data": [
    {
      "regionId": 7105194972737,
      "datatime": "2021-09-13",
      "cropId": 102,
      "regionChinaName": "西合营镇",
      "regionEnglishName": "西合营镇",
      "cropName": "夏玉米",
      "levelDataVos": [
        {
          "regionId": null,
          "levelId": 12,
          "areaNum": 70.81,
          "numberOfPlants": null,
          "levelName": "很差",
          "sortNo": 1,
          "cropId": null,
          "cropName": null,
          "dataTime": null,
          "colorCode": "#E8AF64",
          "tenThousandAreaNum": 0.007081
        },
        {
          "regionId": null,
          "levelId": 18,
          "areaNum": 62.51,
          "numberOfPlants": null,
          "levelName": "差",
          "sortNo": 2,
          "cropId": null,
          "cropName": null,
          "dataTime": null,
          "colorCode": "#D1B54D",
          "tenThousandAreaNum": 0.006251
        },
        {
          "regionId": null,
          "levelId": 13,
          "areaNum": 404.85,
          "numberOfPlants": null,
          "levelName": "较差",
          "sortNo": 3,
          "cropId": null,
          "cropName": null,
          "dataTime": null,
          "colorCode": "#B6BA36",
          "tenThousandAreaNum": 0.040485
        },
        {
          "regionId": null,
          "levelId": 14,
          "areaNum": 13867.71,
          "numberOfPlants": null,
          "levelName": "中等",
          "sortNo": 4,
          "cropId": null,
          "cropName": null,
          "dataTime": null,
          "colorCode": "#83A624",
          "tenThousandAreaNum": 1.386771
        },
        {
          "regionId": null,
          "levelId": 15,
          "areaNum": 57725.7,
          "numberOfPlants": null,
          "levelName": "较好",
          "sortNo": 5,
          "cropId": null,
          "cropName": null,
          "dataTime": null,
          "colorCode": "#508F15",
          "tenThousandAreaNum": 5.77257
        },
        {
          "regionId": null,
          "levelId": 16,
          "areaNum": 570.83,
          "numberOfPlants": null,
          "levelName": "好",
          "sortNo": 6,
          "cropId": null,
          "cropName": null,
          "dataTime": null,
          "colorCode": "#267A0A",
          "tenThousandAreaNum": 0.057083
        },
        {
          "regionId": null,
          "levelId": 17,
          "areaNum": 0,
          "numberOfPlants": null,
          "levelName": "很好",
          "sortNo": 7,
          "cropId": null,
          "cropName": null,
          "dataTime": null,
          "colorCode": "#006600",
          "tenThousandAreaNum": 0
        }
      ],
      "meanOfLevelVos": null,
      "cropStatistics": null,
      "areaNum": 72702.41,
      "numberOfPlants": 0,
      "title": null,
      "option": null,
      "landId": null,
      "levelId": null,
      "tenThousandAreaNum": 7.270241,
      "m": null
    }
    // ...
  ]
}

使用 echarts 插件渲染后得到图表

An image