饼图
{ "type":"pie", "list":[ {"val":100, "color":"blue"}, {"val":200, "color":"gray"} ] }
{ "type":"pie", "font_color":"#fff", "list":[ {"val":100, "color":"blue"}, {"val":200, "color":"gray"}, {"val":300, "color":"#f00|#a00"} ] }
{ "type":"pie", "val":38, "color":"#f00|#a00" }
{ "type":"pie", "font_color":"#0f0", "list":[ {"val":100}, {"val":200}, {"val":300}, {"val":500}, {"val":300}, {"val":20}, {"val":200} ] }
进度圆环
{ "type":"ring", "val":75 }
{ "type":"ring", "val": 87, "size": 30, "back_color":"#aaa", "max":360, "unit": "°" }
{ "type":"ring", "led":36, "val":75, "unit": "%" }
{ "type":"ring", "led":100, "val":75 }
{ "type":"ring", "val": 87, "size": 30, "color": "#f00|#a00", "font": "50px Arial" }
设置
折线图
{ "type":"line", "list":[3,9,1,5,2,11,8,5] }
{ "type":"line", "list":[3,9,1,5,2,11,8,5], "border_size":1, "color":"#f00|#00f" }
{ "type":"line", "list":[3,9,1,5,2,11,8,5], "point_size":3, "point_color":"red", "color":"#666", "max":10, "min":-10 }
{ "type":"line", "size":0, "point_size":2, "fill_color":"#00f|#fff|90", "list":[3,9,1,5,2,7,8,5], "curve":true }
柱状图
{ "type":"bar", "list":[ {"name":"1月", "val":3}, {"name":"2月", "val":9}, {"name":"3月", "val":1}, {"name":"5月", "val":5}, {"name":"6月", "val":2}, {"name":"7月", "val":7}, {"name":"8月", "val":8}, {"name":"9月", "val":5}, {"name":"10月", "val":10}, {"name":"11月", "val":4, "color":"#f00"}, {"name":"12月", "val":7} ] }
{ "type":"bar", "color":"#eee|#f00|45", "list":[ {"name":"中国", "val":3}, {"name":"美国", "val":9}, {"name":"日本", "val":1}, {"name":"俄罗斯", "val":5} ] }
{ "type":"bar", "color":"#00f", "show":"3d_rect", "list":[ {"name":"中国", "val":3}, {"name":"美国", "val":9}, {"name":"日本", "val":1}, {"name":"俄罗斯", "val":5} ] }
{ "type":"bar", "color":"#f00", "show":"3d_circle", "list":[ {"name":"中国", "val":3}, {"name":"美国", "val":9}, {"name":"日本", "val":1}, {"name":"俄罗斯", "val":5} ] }
横向对比图
{ "type":"hbar", "right":20, "list":[ {"name":"中国", "val":3}, {"name":"USA", "val":9}, {"name":"美国", "val":9}, {"name":"日本", "val":1}, {"name":"法国", "val":0}, {"name":"俄罗斯", "val":5}, {"name":"中国", "val":3}, {"name":"美国", "val":9}, {"name":"日本", "val":1}, {"name":"俄罗斯", "val":5}, {"name":"中国", "val":3, "color":"red"}, {"name":"美国", "val":9}, {"name":"日本", "val":1}, {"name":"俄罗斯", "val":5}, {"name":"中国", "val":3}, {"name":"美国", "val":9}, {"name":"日本", "val":1}, {"name":"俄罗斯", "val":5} ] }
{ "type":"hbar", "right":20, "back_color":false, "line_height":20, "color":"#fbb|#f00|90", "list":[ {"name":"中国", "val":3}, {"name":"USA", "val":9}, {"name":"美国", "val":9}, {"name":"日本", "val":1}, {"name":"法国", "val":0}, {"name":"俄罗斯", "val":5} ] }
颜色标签
{ "type":"tag_val", "list":[3,7,14,18,9,11,5,3,7,14,18,-1,9,11,5,3,7,14,18,9,11,5,3,7,14,18,9,11,5], "max":20, "r":5, "color_h":250 }
{ "type":"tag", "padding":10, "list":[ {"name":"中国", "color":"#f00"}, {"name":"USA", "color":"#0f0"}, {"name":"美国", "color":"#00f"}, {"name":"日本", "color":"#ff0", "blink":true}, {"name":"法国", "color":"#f0f"}, {"name":"俄罗斯", "color":"#0ff"}, {"name":"中国", "color":"#f00"}, {"name":"USA", "color":"#0f0"}, {"name":"美国", "color":"#00f"}, {"name":"日本", "color":"#ff0", "blink":true}, {"name":"法国", "color":"#f0f"}, {"name":"俄罗斯", "color":"#0ff"}, {"name":"中国", "color":"#f00|#00f|90"}, {"name":"USA", "color":"#0f0"}, {"name":"美国", "color":"#00f", "blink":true}, {"name":"日本", "color":"#ff0"}, {"name":"法国", "color":"#f0f"}, {"name":"俄罗斯", "color":"#0ff"} ] }
数字显示
{ "type":"num", "val": 315, "val_count": 5, "r":5, "color":"#00f", "back_color":"#fff", "border": 2, "val_padding":5 }
{ "type":"num", "val": 315, "val_count": 5, "back_color":"#fff|#0f0|90", "color":"#f00|#00f|90", "border": 1 }
设置1
设置2
进度
{ "type":"progress", "val": 75 }
{ "type":"progress", "val_padding": 3, "back_color":"#000", "color":"#0f0", "val": 75 }
{ "type":"progress", "val": 56, "r": 5, "color":"#00f", "back_color":"#fee", "border": 1 }
{ "type":"progress", "val": 56, "val_padding": 3, "r": 5, "color":"#00f", "back_color":"#fee", "border": 1 }
{ "type":"progress", "val": 56, "led": true }
{ "type":"progress", "val": 56, "led": true, "color":"#f00|#faa", "r": 3, "border": 1 }
设置
仪表盘
{ "type":"gauge", "name": "温度℃", "val": 0, "min": -200, "max": 200, "split_color":"#000", "split_count":25, "color":"#00f" }
{ "type":"gauge", "name": "气温", "unit": "℃", "val": 150, "max": 200, "color":"#f00|#00f", "split_count":40, "pointer_type":2 }
{ "type":"gauge", "name": "温度℃", "val": 150, "max": 200, "color":"#000", "font_color":"#000", "pointer_type":3, "pointer_len":1.1, "size":30, "range_list":[ {"min":0, "max":90, "color":"#d00|#f00"}, {"min":90, "max":160, "color":"#0d0"}, {"min":160, "max":200, "color":"#00d"} ] }
{ "type":"gauge", "name": "温度℃", "val": 150, "max": 200, "color":"#00f", "led":true, "split_count":40, "pointer_type":2 }
设置
液位
{ "type":"level", "name": "C01罐", "val": 150, "max": 200 }
{ "type":"level", "name": "C01罐", "val": 98 }
{ "type":"level", "name": "C01罐", "val": 95 }
{ "type":"level", "name": "C01罐", "color":"#a00|#f00", "max": 50, "unit": "t", "val": 25 }
{ "type":"level", "name": "C01罐", "color":"#a00|#f00", "val": 3 }
设置
性能监控
{ "type":"monitor", "color":"#000", "max":2000 }
{ "type":"monitor", "list":[], "line_width":0, "max":1000, "font_color":"#000", "fill_color":"#f00|#0f0|90" }
当前值:
-1
,
-1
雷达图
{ "type":"radar", "list":[ {"name":"数学", "val":98}, {"name":"语文", "val":87}, {"name":"英语", "val":53}, {"name":"物理", "val":76}, {"name":"化学", "val":10} ] }
{ "type":"radar", "fill_color":"#fdd|#f00", "line_color":"#000", "list":[ {"name":"CPU", "val":98}, {"name":"内存", "val":87}, {"name":"硬盘", "val":53}, {"name":"显卡", "val":76}, {"name":"网络", "val":60}, {"name":"电源", "val":57} ] }
{ "type":"radar", "fill_color":"#fdd|#f00", "line_color":"#000", "show":"circle", "back_color":"#eef|#aaf", "border_color":"#999", "list":[ {"name":"CPU", "val":98}, {"name":"内存", "val":87}, {"name":"硬盘", "val":53}, {"name":"显卡", "val":76}, {"name":"网络", "val":60}, {"name":"电源", "val":57} ] }
时间图
{ "type":"time", "min":"2021-10-01", "max":"2021-10-02", "list":[ {"name":"DEV01", "list":[ {"dt1":"11:12", "dt2":"15:26", "text":"文字abc123"}, {"dt1":"8:05", "dt2":"10:17", "text":"文字abc123"}, {"dt1":"3:05", "dt2":"6:17", "text":"文字abc123"} ]}, {"name":"DEV02", "list":[ {"dt1":"16:12", "dt2":"20:26", "text":"文字abc123"}, {"dt1":"1:35", "dt2":"9:17", "text":"文字abc123"}, {"dt1":"10:00", "dt2":"11:17", "text":"文字abc123"}, {"dt1":"22:00", "dt2":"23:55", "text":"文字abc123"} ]}, {"name":"DEV03", "list":[ {"dt1":"16:12", "dt2":"20:26", "text":"文字abc123"}, {"dt1":"1:35", "dt2":"9:17", "text":"文字abc123"}, {"dt1":"10:00", "dt2":"11:17", "text":"文字abc123"}, {"dt1":"22:00", "dt2":"23:55", "text":"文字abc123"} ]}, {"name":"DEV04", "list":[ {"dt1":"16:12", "dt2":"20:26", "text":"文字abc123"}, {"dt1":"1:35", "dt2":"9:17", "text":"文字abc123"}, {"dt1":"10:00", "dt2":"11:17", "text":"文字abc123"}, {"dt1":"22:00", "dt2":"23:55", "text":"文字abc123"} ]}, {"name":"DEV04", "list":[ {"dt1":"16:12", "dt2":"20:26", "text":"文字abc123"}, {"dt1":"1:35", "dt2":"9:17", "text":"文字abc123"}, {"dt1":"10:00", "dt2":"11:17", "text":"文字abc123"}, {"dt1":"22:00", "dt2":"23:55", "text":"文字abc123"} ]}, {"name":"DEV04", "list":[ {"dt1":"16:12", "dt2":"20:26", "text":"文字abc123"}, {"dt1":"1:35", "dt2":"9:17", "text":"文字abc123"}, {"dt1":"10:00", "dt2":"11:17", "text":"文字abc123"}, {"dt1":"22:00", "dt2":"23:55", "text":"文字abc123"} ]} ] }
{ "type":"time", "min":"2021-07-01", "max":"2021-10-02", "list":[ {"name":"DEV01", "list":[ {"dt1":"2021-07-02", "dt2":"2021-07-10 10:22:33", "text":"文字abc123"}, {"dt1":"2021-08-01", "dt2":"2021-08-15", "text":"文字abc123"}, {"dt1":"2021-08-30", "dt2":"2021-09-23", "text":"文字abc123"} ]}, {"name":"DEV02", "list":[ {"dt1":"2021-07-02", "dt2":"2021-07-10 10:22:33", "text":"文字abc123"}, {"dt1":"2021-08-01", "dt2":"2021-08-15", "text":"文字abc123"}, {"dt1":"2021-08-30", "dt2":"2021-09-23", "text":"文字abc123"}, {"dt1":"2021-09-25", "dt2":"2021-10-01", "text":"文字abc123"} ]} ] }
栅格
{ "type":"grid", "color":"blue", "list":[ [10,20,7], [10,21,8], [10,22,1], [10,23,20], [10,24,59], [11,20,7], [11,21,8], [11,22,1], [11,23,20], [11,26,59] ] }
{ "type":"grid", "center":[0,0], "show":"circle", "list":[ [0,0,1] ] }
生成栅格数据
图片
{ "type":"image", "list":[ {"url":"http://www.xahy.gov.cn/web_files/picture/2021/10/21/202110211730459442058.jpg", "zoom":1}, {"url":"https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png", "x":-20, "y":0, "zoom":0.2} ], "point":[ {"x":20, "y":20}, {"x":100, "y":100, "size":5, "color":"#f00"} ] }
随机跳转
跳转(100,100)