Toggle navigation
series type custom画图
By
自由自在的我77
2017-07-06 03:20:28
脚本
16
21
作品使用的第三方脚本
数据管理
上传数据
支持小于 5M 任意格式（csv, xlsx, json, xml, ...）的数据文件
上传后可以通过生成的文件链接异步获取托管的数据。
历史数据
0 条
无历史数据
代码修改记录
信息提示
保存作品
对当前截图不满意？你还可以
上传本地截图
重新截图
作品名称
作品描述
标签
geo
grid
legend
markLine
markPoint
bar
effectScatter
line
lines
map
timeline
title
toolbox
tooltip
visualMap
作品默认版本
最新
16
15
14
13
12
11
10
9
8
7
6
5
4
3
2
1
20:11:45
图表已生成
整理代码
刷新
代码
option = { "title": { "show": false, "text": "", "left": 0 }, "tooltip": { "trigger": "none", "axisPointer": { "type": "cross" } }, "axisPointer": { "label": { "backgroundColor": "#cccccc", "textStyle": { "color": "#333333", "fontSize": 12 } }, "link": { "xAxisIndex": "all" } }, "grid": [{ "left": "5%", "right": "35", "bottom": "0%", "top": "5%", "height": "75%" }, { "left": "5%", "right": "35", "top": "90%", "bottom": "0", "height": "10%" }], "xAxis": [{ "type": "category", "gridIndex": 0, "data": ["03-06-2017", "03-07-2017", "03-08-2017", "03-09-2017", "03-10-2017", "03-13-2017", "03-14-2017", "03-15-2017", "03-16-2017", "03-17-2017", "03-20-2017", "03-21-2017", "03-22-2017", "03-23-2017", "03-24-2017", "03-27-2017", "03-28-2017", "03-29-2017", "03-30-2017", "03-31-2017", "04-03-2017", "04-04-2017", "04-05-2017", "04-06-2017", "04-07-2017", "04-10-2017", "04-11-2017", "04-12-2017", "04-13-2017", "04-17-2017", "04-18-2017", "04-19-2017", "04-20-2017", "04-21-2017", "04-24-2017", "04-25-2017", "04-26-2017", "04-27-2017", "04-28-2017", "05-01-2017", "05-02-2017", "05-03-2017", "05-04-2017", "05-05-2017", "05-08-2017", "05-09-2017", "05-10-2017", "05-11-2017", "05-12-2017", "05-15-2017", "05-16-2017", "05-17-2017", "05-18-2017", "05-19-2017", "05-22-2017", "05-23-2017", "05-24-2017", "05-25-2017", "05-26-2017", "05-30-2017", "05-31-2017", "06-01-2017", "06-02-2017", "06-05-2017", "06-06-2017", "06-07-2017", "06-08-2017", "06-09-2017", "06-12-2017", "06-13-2017", "06-14-2017", "06-15-2017", "06-16-2017", "06-19-2017", "06-20-2017", "06-21-2017", "06-22-2017", "06-23-2017", "06-26-2017", "06-27-2017", "06-28-2017", "06-29-2017", "06-30-2017", "07-03-2017", "07-05-2017" ], "scale": true, "boundaryGap": true, "axisLine": { "show": false }, "axisTick": { "show": false }, "splitLine": { "show": false }, "axisLabel": { "textStyle": { "color": "#999999" } }, "min": "dataMin", "max": "dataMax", "axisPointer": { "z": 100 } }, { "type": "category", "gridIndex": 1, "data": ["03-06-2017", "03-07-2017", "03-08-2017", "03-09-2017", "03-10-2017", "03-13-2017", "03-14-2017", "03-15-2017", "03-16-2017", "03-17-2017", "03-20-2017", "03-21-2017", "03-22-2017", "03-23-2017", "03-24-2017", "03-27-2017", "03-28-2017", "03-29-2017", "03-30-2017", "03-31-2017", "04-03-2017", "04-04-2017", "04-05-2017", "04-06-2017", "04-07-2017", "04-10-2017", "04-11-2017", "04-12-2017", "04-13-2017", "04-17-2017", "04-18-2017", "04-19-2017", "04-20-2017", "04-21-2017", "04-24-2017", "04-25-2017", "04-26-2017", "04-27-2017", "04-28-2017", "05-01-2017", "05-02-2017", "05-03-2017", "05-04-2017", "05-05-2017", "05-08-2017", "05-09-2017", "05-10-2017", "05-11-2017", "05-12-2017", "05-15-2017", "05-16-2017", "05-17-2017", "05-18-2017", "05-19-2017", "05-22-2017", "05-23-2017", "05-24-2017", "05-25-2017", "05-26-2017", "05-30-2017", "05-31-2017", "06-01-2017", "06-02-2017", "06-05-2017", "06-06-2017", "06-07-2017", "06-08-2017", "06-09-2017", "06-12-2017", "06-13-2017", "06-14-2017", "06-15-2017", "06-16-2017", "06-19-2017", "06-20-2017", "06-21-2017", "06-22-2017", "06-23-2017", "06-26-2017", "06-27-2017", "06-28-2017", "06-29-2017", "06-30-2017", "07-03-2017", "07-05-2017" ], "scale": true, "boundaryGap": true, "axisLine": { "onZero": false, "lineStyle": { "color": "#dddddd" } }, "axisTick": { "show": false, "interval": 1 }, "splitLine": { "show": false, "lineStyle": { "color": ["#f5f5f5"] } }, "splitNumber": 20, "axisLabel": { "show": false, "textStyle": { "color": "#999", "fontSize": 10 } }, "min": "dataMin", "max": "dataMax", "axisPointer": { "label": {} } }], "yAxis": [{ "scale": true, "gridIndex": 0, "splitArea": { "show": false }, "axisLabel": { "textStyle": { "color": "#999", "fontSize": 10 } }, "axisLine": { "lineStyle": { "color": "#dddddd" } }, "min": "dataMin", "max": "dataMax", "boundaryGap": ["1%", "1%"], "position": "right" }, { "scale": true, "gridIndex": 1, "axisLabel": { "show": false, "textStyle": { "color": "#999", "fontSize": 10 } }, "axisLine": { "show": false, "lineStyle": { "color": "#dddddd" } }, "axisTick": { "show": false, "lineStyle": {} }, "splitLine": { "show": false }, "axisPointer": { "label": {} }, "min": "dataMin", "max": "dataMax", "position": "right", "interval": 1848091 }], "dataZoom": [{ "type": "inside", "xAxisIndex": [0, 1], "startValue": 55, "endValue": 84, "zoomLock": true }], "series": [{ "name": "日K", "type": "candlestick", "data": [ [226.58, 227.92, 225, 228.34], [226.95, 228.01, 225.94, 228.01], [227.17, 223.82, 223.56, 227.17], [ 224, 222.34, 221.66, 225.4 ], [222.34, 220.07, 218.6, 224.77], [218.53, 217.26, 215.635, 219.41], [ 217, 219.35, 215.93, 219.85 ], [219.28, 223.13, 218.71, 223.69], [222.86, 220.54, 219.74, 223.44], [ 221.37, 222.49, 221.045, 225.625 ], [222.71, 223.64, 220.65, 224.06], [223.77, 224.28, 222.76, 225.5 ], [224.38, 225.77, 222.38, 226.31], [224.82, 225.92, 224.44, 227.74], [226.1, 222.91, 222.82, 227.18 ], [221.69, 220.91, 220.5, 224.9], [220.88, 222.16, 218.86, 222.33], [221.55, 219.95, 217.71, 221.86 ], [219.08, 219.4, 217.19, 220.795], [219.49, 218.91, 218.071, 221.385], [219, 219.31, 216.063, 220.19 ], [219.26, 220.31, 217.95, 221.8], [220.01, 222.29, 219.84, 223.47], [ 221.83, 222.64, 221.37, 223.61 ], [223.06, 223.6, 222.61, 224.17], [223.61, 225.84, 223.15, 226.01], [ 225.99, 226.37, 225.64, 227.21 ], [225.46, 224.3, 223.41, 226.81], [223.51, 225.97, 223.48, 226.3], [ 226.96, 231.19, 225.77, 231.22 ], [230.08, 231.18, 228.31, 232.21], [231.68, 229.99, 229.37, 231.68 ], [230.24, 229.4, 228.18, 230.4], [229.28, 228.37, 228.33, 230.23], [228.93, 226.47, 222.57, 229.03 ], [226.47, 225.54, 224.7, 226.75], [225.62, 223.93, 223.3, 225.62], [223.93, 213, 211.022, 223.84 ], [211.91, 209.38, 208.46, 212.97], [210.33, 207.23, 205.01, 211.53], [207.01, 207.27, 206.18, 210.41 ], [208.08, 205.53, 203.6, 208.54], [205.15, 207.63, 201.97, 208.08], [207.79, 208.25, 206.3, 210 ], [208.55, 208.45, 206.96, 208.77], [207.95, 208.07, 206.77, 208.3], [207.88, 208.92, 207.75, 211.68 ], [208.07, 208.47, 207.19, 209.3], [208.17, 208.64, 207.38, 209.36], [ 208.37, 209.73, 208.31, 210.06 ], [209.68, 208.14, 207.15, 210.03], [207.37, 212.95, 207.37, 214.18 ], [213.37, 216.12, 212.38, 216.16], [215.64, 214.48, 213.8, 216.1899], [214.72, 215.6, 213.96, 216.73 ], [215.82, 217.2, 215.11, 217.84], [217, 217.57, 216.6, 218.99], [217.76, 217.09, 216.2962, 218.33 ], [217.83, 216.39, 215.915, 217.98], [216.44, 214.35, 214, 216.82], [214.56, 215.35, 214.18, 215.79 ], [215.21, 212.27, 210.3, 215.3], [213, 213.92, 212.44, 214.32], [213.71, 211.35, 210.85, 213.82 ], [211.35, 207.9, 207.65, 211.35], [207.85, 209.87, 207.69, 209.87], [209.87, 210.91, 206.74, 211.72 ], [209.6, 207.56, 206.95, 210.89], [205.56, 207.04, 204.84, 208.35], [ 206.86, 208.4, 206.23, 208.43 ], [208.05, 209.88, 207.55, 210.94], [209.42, 212.68, 209, 212.75], [ 213, 213.66, 211.33, 214.11 ], [214.21, 211.78, 210.76, 214.21], [211.54, 211.75, 207.11, 212], [ 212.12, 212.3, 211.49, 213.405 ], [211.81, 211.18, 209.87, 212.145], [211.23, 213.11, 211.23, 214.96 ], [214.21, 212.49, 211.98, 215.62], [211.99, 210.27, 209.6, 212.924], [210.78, 209.44, 209.355, 211.46 ], [208.63, 207.57, 206.9, 209.37], [208.71, 208.53, 207.53, 210], [209.93, 212.73, 208.43, 213.54 ], [212.23, 208.06, 208.01, 212.26] ], "itemStyle": { "normal": { "color": "#00ab00", "color0": "#e93030", "borderColor": "#00ab00", "borderColor0": "#e93030" } }, "markArea": { "silent": true, "itemStyle": { "normal": { "color": "#f2dbdb", "borderWidth": 1, "borderType": "dashed", "borderColor": "#f2dbdb" } }, "data": [] }, "markLine": { "symbol": ["none", "none"], "lineStyle": { "normal": { "color": "#da9be8", "width": 2 }, "emphasis": { "color": "#da9be8", "width": 2 } }, "data": [] } }, { "name": "Volumn", "type": "bar", "xAxisIndex": 1, "yAxisIndex": 1, "data": [424320, 667610, 861329, 676020, 767397, 894005, 667869, 742691, 798037, 1477814, 721969, 955064, 759030, 843017, 635639, 576107, 760143, 703500, 923930, 1004687, 856764, 745131, 667120, 550537, 435228, 518888, 505439, 638251, 441147, 694614, 604326, 453781, 752881, 819809, 976356, 526442, 731934, 2272411, 1423353, 1152457, 1035021, 997540, 1232436, 858177, 1009129, 803976, 683844, 912863, 766099, 832362, 999674, 1665329, 1652290, 2114691, 938054, 839852, 773581, 1018483, 976297, 711444, 2060934, 1251077, 1064611, 919015, 1354989, 1303180, 1856075, 1275954, 1481467, 1431831, 1104447, 855424, 943787, 726564, 937318, 585908, 632189, 703832, 573893, 777597, 627353, 669687, 620901, 562898, 756519 ], "itemStyle": { "normal": {} } }, { "type": "custom", "xAxisIndex": 0, "yAxisIndex": 0, "label": { "normal": { "show": false, "position": "top" } }, renderItem: function(params, api) { let start = api.coord([api.value(0), api.value(2)]); let end = api.coord([api.value(1), api.value(3)]); let style = api.style(); let fix = api.size([1, 0])[0] / 2; // 针对一根bar进行定制 let addition = yMax - yMin; let offset = api.value(1) === api.value(0) ? addition * constantConfig.LARGE_OFFSET : addition * constantConfig.SMALL_OFFSET; let padding = api.coord([0, offset])[1] - api.coord([0, 0])[1]; return { type: 'rect', shape: { x: start[0] - fix, y: start[1] - padding, width: end[0] - start[0] + fix * 2, height: end[1] - start[1] + 2 * padding }, style }; }, "dimensions": [], "encode": { "x": [0, 1], "y": [2, 3], "tooltip": [0, 1, 2, 3], "itemName": [2] }, "data": [{ "name": "CandleStick", "value": [68, 70, 204.84, 210.94], "itemStyle": { "normal": { "color": "rgba(0, 136, 0, .2)", "borderWidth": 0, "borderType": "dotted", "borderColor": "rgba(0, 136, 0, .2)" } } }] }], "backgroundColor": "rgba(255,255,255,1)" }
