添加并配置组件

本文档为您介绍,如何在空白画布中添加并配置数据看板组件。

添加并配置地图组件

  1. 登录DataV控制台

  2. 工作台页面中,选择已创建的数据看板,单击编辑

  3. 在画布左侧组件库页签,单击地图 > 3D平面地图,将3D平面地图组件添加到画布中。

  4. 在画布中单击3D平面地图组件,在左侧的子组件面板中选择od飞线层单点柱状层

  5. 单击od飞线层子组件,在样式页签自定义修改飞线颜色飞线线型等飞线样式。

  6. 数据源页签将文中的od飞线层数据json文件数据复制粘贴到数据源编辑框中。

  7. 单击单点柱状层子组件,在样式页签自定义修改柱子高度填充颜色等柱子样式。

  8. 数据源页签将文中的单点柱状层数据json文件数据复制粘贴到数据源编辑框中。

  9. 单击进入3D平面地图组件,单击右上角的image.png图标进入沉浸模式,下钻到北京市,并在样式页签自定义修改地图样式,数据源页签保持不变。

  10. 配置完成效果,请参考下图。image.png

单点柱状层数据json文件

[
  {
    "lat": 40.12590042607967,
    "lng": 116.67138384491768,
    "name": "label1",
    "sizeField": 170,
    "colorField": 170
  },
  {
    "lat": 40.664972998299504,
    "lng": 116.36282589914232,
    "name": "label2",
    "sizeField": 70,
    "colorField": 70
  },
  {
    "lat": 39.81034401029569,
    "lng": 115.88483259458668,
    "name": "label3",
    "sizeField": 170,
    "colorField": 170
  },
  {
    "lat": 39.87206529943773,
    "lng": 116.81947870064393,
    "name": "label4",
    "sizeField": 170,
    "colorField": 170
  },
  {
    "lat": 40.40351732443225,
    "lng": 117.14260310471698,
    "name": "label5",
    "sizeField": 270,
    "colorField": 270
  },
  {
    "lat": 39.90914145845798,
    "lng": 116.67883079454246,
    "name": "label6",
    "sizeField": 140,
    "colorField": 140
  },
  {
    "lat": 40.7020877315149,
    "lng": 116.7381069251856,
    "name": "label7",
    "sizeField": 470,
    "colorField": 470
  },
  {
    "lat": 39.61646341638806,
    "lng": 116.14670361279184,
    "name": "label8",
    "sizeField": 270,
    "colorField": 270
  },
  {
    "lat": 40.865354624240396,
    "lng": 116.68870103639685,
    "name": "label9",
    "sizeField": 210,
    "colorField": 210
  }
]

od飞线层数据json文件

[
  {
    "id": 1,
    "name": "安徽省 -> 湖北省",
    "value": 1,
    "colorField": 5,
    "geometry": {
      "type": "LineString",
      "coordinates": [
        [
          116.405285,
          39.904989
        ],
        [
          117.1285001635342,
          40.286711869544185
        ]
      ]
    }
  },
  {
    "id": 2,
    "name": "安徽省 -> 北京市",
    "value": 2,
    "colorField": 2,
    "geometry": {
      "type": "LineString",
      "coordinates": [
        [
          116.405285,
          39.904989
        ],
        [
          115.7519689833273,
          40.002091020646034
        ]
      ]
    }
  },
  {
    "id": 3,
    "name": "安徽省 -> 天津市",
    "value": 3,
    "colorField": 2,
    "geometry": {
      "type": "LineString",
      "coordinates": [
        [
          116.405285,
          39.904989
        ],
        [
          115.91626782055476,
          40.5443387995133
        ]
      ]
    }
  },
  {
    "id": 4,
    "name": "安徽省 -> 河北省",
    "value": 4,
    "colorField": 3,
    "geometry": {
      "type": "LineString",
      "coordinates": [
        [
          116.405285,
          39.904989
        ],
        [
          116.51952384752327,
          40.644585315977665
        ]
      ]
    }
  },
  {
    "id": 5,
    "name": "安徽省 -> 山西省",
    "value": 5,
    "colorField": 3,
    "geometry": {
      "type": "LineString",
      "coordinates": [
        [
          116.405285,
          39.904989
        ],
        [
          116.47839783929638,
          40.43816003796805
        ]
      ]
    }
  },
  {
    "id": 6,
    "name": "安徽省 -> 内蒙古自治区",
    "value": 6,
    "colorField": 5,
    "geometry": {
      "type": "LineString",
      "coordinates": [
        [
          116.405285,
          39.904989
        ],
        [
          115.69399528036193,
          39.66245367451081
        ]
      ]
    }
  },
  {
    "id": 7,
    "name": "安徽省 -> 辽宁省",
    "value": 7,
    "colorField": 3,
    "geometry": {
      "type": "LineString",
      "coordinates": [
        [
          116.405285,
          39.904989
        ],
        [
          115.98377599532307,
          40.19504929561505
        ]
      ]
    }
  },
  {
    "id": 8,
    "name": "安徽省 -> 吉林省",
    "value": 8,
    "colorField": 3,
    "geometry": {
      "type": "LineString",
      "coordinates": [
        [
          116.405285,
          39.904989
        ],
        [
          116.57951643065338,
          40.341010790596606
        ]
      ]
    }
  },
  {
    "id": 9,
    "name": "安徽省 -> 黑龙江省",
    "value": 9,
    "colorField": 2,
    "geometry": {
      "type": "LineString",
      "coordinates": [
        [
          116.405285,
          39.904989
        ],
        [
          116.55654661333388,
          40.074821016922925
        ]
      ]
    }
  },
  {
    "id": 10,
    "name": "安徽省 -> 上海市",
    "value": 10,
    "colorField": 1,
    "geometry": {
      "type": "LineString",
      "coordinates": [
        [
          116.405285,
          39.904989
        ],
        [
          116.86359734638494,
          39.7596709650833
        ]
      ]
    }
  }
]

添加并配置业务指标趋势

  1. 在画布左侧组件库页签,单击信息 > 业务指标趋势,将组件添加到画布中。

  2. 单击组件,在数据看板右侧的样式面板中,根据效果图配置底层面板中的标题图标数值

  3. 重复上述步骤,完成所有业务指标趋势组件的配置。

添加并配置通用标题

  1. 在画布左侧组件库页签,单击信息 > 通用标题,将通用标题组件添加到画布中。

  2. 单击组件,在数据看板右侧的样式面板中,修改标题名。

  3. 重复以上操作,继续添加其他的通用标题组件。

添加并配置数字翻牌器

  1. 在画布左侧组件库页签,单击信息 > 数字翻牌器

  2. 单击组件,在数据看板右侧的样式面板中,配置数字翻牌器的样式。

  3. 在数字翻牌器的数据源面板,将value值改成您需要显示的数据。

  4. 重复以上操作,继续添加其他的数字翻牌器组件。

添加并配置时间器

  1. 在画布左侧组件库页签,单击信息 > 时间器

  2. 配置时间器的样式,修改图标样式时间器等配置。

添加并配置进度条

  1. 在画布左侧组件库页签,单击控件 > 数据类 > 进度条

  2. 配置进度条的样式,修改全局样式百分比条数据等配置。