首页 帮助中心 基调听云大屏 堆叠柱状图

3D 堆叠柱状图

组件名称:3D堆叠柱状图

组件样式:

堆叠柱状图
样式1:该样式是固定格式(高度定制)的样式,API要求严格,图例必须是4个,数据必须分组两组,且每组里面有两组数据。

堆叠柱状图
样式2:该样式数据配置比较灵活,数据部分在图例和数据的数量都不固定。**通过不同的API字段来控制样式,如果在组件创建之后切换了API,需要保存后刷新才能生效。**

组件说明:

堆叠柱状图返回格式,data.series必须返回两条数据 。

请求方式:POST

https://report.tingyun.com/example/stackbar.json

参数

字段 类型 描述 是否必选
currentTime Number 当前时间戳。
token String 盐值,校验规则为md5(timePeriod+currentTime+
配置的token),
例如:timePeriod为30,currentTime为
1513137332798,token为abc,则应对
301513137332798abc进行md5。
timePeriod Number 时间范围分钟数。

样式1正确响应数据

字段 类型 描述
status Number 状态码
data Object
max String Y轴最大值
legend Object[] 图例
name String 图例名称
series Object[] 数据
id String id
totalname String 名称1
total Number 名称1数字
relatedname String 名称2
related Number 名称2数字
series Object[] 堆叠图数据
name String 名称
list Object[] 数据集

示例

样式1:

  HTTP/1.1 200 OK
{
    "status": 200,
    "data": {
        "max": 200,
        "legend": [
            {
                "name": "Critical"
            },
            {
                "name": "Major"
            },
            {
                "name": "Mimor"
            },
            {
                "name": "Non-fault inquity"
            }
        ],
        "series": [
            {
                "id": 1,
                "totalname": "ICTSM Total",
                "total": 90,
                "relatedname": "Related Project QTY",
                "related": 47,
                "series": [
                    {
                        "name": "L2",
                        "list": [
                            48,
                            12,
                            28,
                            36
                        ]
                    },
                    {
                        "name": "L3",
                        "list": [
                            48,
                            29,
                            44,
                            24
                        ]
                    }
                ]
            },
            {
                "id": 2,
                "totalname": "ICTOM Total",
                "total": 99,
                "relatedname": "Related Project QTY",
                "related": 67,
                "series": [
                    {
                        "name": "L2",
                        "list": [
                            43,
                            38,
                            18,
                            7
                        ]
                    },
                    {
                        "name": "L3",
                        "list": [
                            23,
                            29,
                            29,
                            27
                        ]
                    }
                ]
            }
        ]
    }
}

样式2正确响应数据

字段 类型 描述
status Number 状态码
data Object
max String Y轴最大值
legend Object[] 图例
name String 图例名称
series Object[] 数据
id String id
singseries Object[] 堆叠图数据
name String 名称
list Object[] 数据集

样式2:

  HTTP/1.1 200 OK
{
    "status": 200,
    "data": {
        "max": 200,
        "legend": [
            {
                "name": "Critical"
            },
            {
                "name": "Major"
            },
            {
                "name": "Mimor"
            },
            {
                "name": "Non-fault inquity"
            }
        ],
        "singseries":{
          "id": 1,         
          "series": [
            {
              "name": "L1",
              "list": [
                20,
                30,
                40,
                50
              ]
            },
            {
              "name": "L2",
              "list": [
               30,
               0,
               50,
               0
              ]
            },
            {
              "name": "L3",
              "list": [
               30,
               0,
               50,
               20
              ]
            },
            {
              "name": "L4",
              "list": [
               30,
               10,
               50,
               20
              ]
            }          
          ]
        }   
    }
}