Toggle navigation
bar/legend 和 pie 的颜色不一样
By
高***猫
2018-04-18 06:09:18
脚本
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 ={ "selectedMode": "single", "calculable": true, "color": [ "#c23531", "#2f4554", "#61a0a8", "#d48265", "#91c7ae", "#749f83", "#ca8622", "#bda29a", "#6e7074", "#546570", "#c4ccd3" ], "textStyle": { "fontFamily": "Microsoft YaHei", "fontSize": 12, "fontStyle": "normal", "fontWeight": "normal" }, "animation": "auto", "animationDuration": 1000, "animationDurationUpdate": 300, "animationEasing": "exponentialOut", "animationEasingUpdate": "cubicOut", "animationThreshold": 2000, "progressiveThreshold": 3000, "progressive": 400, "hoverLayerThreshold": 3000, "useUTC": false, "toolbox": [ { "feature": { "dataZoom": { "yAxisIndex": false, "show": true, "icon": { "zoom": "M0,13.5h26.9 M13.5,26.9V0 M32.1,13.5H58V58H13.5 V32.1", "back": "M22,1.4L9.9,13.5l12.3,12.3 M10.3,13.5H54.9v44.6 H10.3v-26" }, "title": { "zoom": "区域缩放", "back": "区域缩放还原" }, "iconStatus": { "zoom": "normal", "back": "normal" } } }, "show": true, "z": 6, "zlevel": 0, "orient": "horizontal", "left": "right", "top": "top", "backgroundColor": "transparent", "borderColor": "#ccc", "borderWidth": 0, "padding": 5, "itemSize": 15, "itemGap": 8, "showTitle": true, "iconStyle": { "normal": { "borderColor": "#666", "color": "none" }, "emphasis": { "borderColor": "#3E98C5" } } } ], "title": [ { "text": "Animation 组的 TimeLog 统计结果", "x": "center", "left": "center", "zlevel": 0, "z": 6, "show": true, "target": "blank", "subtext": "", "subtarget": "blank", "top": 0, "backgroundColor": "rgba(0,0,0,0)", "borderColor": "#ccc", "borderWidth": 0, "padding": 5, "itemGap": 10, "textStyle": { "fontSize": 18, "fontWeight": "bolder", "color": "#333" }, "subtextStyle": { "color": "#aaa" }, "right": null } ], "axisPointer": [ { "show": "auto", "triggerOn": null, "zlevel": 0, "z": 50, "type": "line", "snap": false, "triggerTooltip": true, "value": null, "status": null, "link": [], "animation": null, "animationDurationUpdate": 200, "lineStyle": { "color": "#aaa", "width": 1, "type": "solid" }, "shadowStyle": { "color": "rgba(150,150,150,0.3)" }, "label": { "show": true, "formatter": null, "precision": "auto", "margin": 3, "textStyle": { "color": "#fff" }, "padding": [ 5, 7, 5, 7 ], "backgroundColor": "auto", "borderColor": null, "borderWidth": 0, "shadowBlur": 3, "shadowColor": "#aaa" }, "handle": { "show": false, "icon": "M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4h1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7v-1.2h6.6z M13.3,22H6.7v-1.2h6.6z M13.3,19.6H6.7v-1.2h6.6z", "size": 45, "margin": 50, "color": "#333", "shadowBlur": 3, "shadowColor": "#aaa", "shadowOffsetX": 0, "shadowOffsetY": 2, "throttle": 40 } } ], "tooltip": [ { "trigger": "axis", "align": "left", "axisPointer": { "type": "cross", "axis": "auto", "animation": "auto", "animationDurationUpdate": 200, "animationEasingUpdate": "exponentialOut", "crossStyle": { "color": "#999", "width": 1, "type": "dashed", "textStyle": {} } }, "zlevel": 0, "z": 8, "show": true, "showContent": true, "triggerOn": "mousemove|click", "alwaysShowContent": false, "displayMode": "single", "confine": false, "showDelay": 0, "hideDelay": 100, "transitionDuration": 0.4, "enterable": false, "backgroundColor": "rgba(50,50,50,0.7)", "borderColor": "#333", "borderRadius": 4, "borderWidth": 0, "padding": 5, "extraCssText": "", "textStyle": { "color": "#fff", "fontSize": 14 } } ], "yAxis": [ { "type": "value", "name": "小时", "boundaryGap": [ 0, 0 ], "splitNumber": 5, "show": true, "zlevel": 0, "z": 0, "inverse": false, "nameLocation": "end", "nameRotate": null, "nameTruncate": { "maxWidth": null, "ellipsis": "...", "placeholder": "." }, "nameTextStyle": {}, "nameGap": 15, "silent": false, "triggerEvent": false, "tooltip": { "show": false }, "axisPointer": { "status": "hide", "value": 43.74857142857143, "seriesDataIndices": [] }, "axisLine": { "show": true, "onZero": true, "lineStyle": { "color": "#333", "width": 1, "type": "solid" } }, "axisTick": { "show": true, "inside": false, "length": 5, "lineStyle": { "width": 1 } }, "axisLabel": { "show": true, "inside": false, "rotate": 0, "showMinLabel": null, "showMaxLabel": null, "margin": 8, "textStyle": { "fontSize": 12 } }, "splitLine": { "show": true, "lineStyle": { "color": [ "#ccc" ], "width": 1, "type": "solid" } }, "splitArea": { "show": false, "areaStyle": { "color": [ "rgba(250,250,250,0.3)", "rgba(200,200,200,0.3)" ] } }, "offset": 0, "rangeEnd": null, "rangeStart": null, "max": 52.8 } ], "xAxis": [ { "type": "category", "axisLabel": { "interval": 0, "show": true, "inside": false, "rotate": 0, "showMinLabel": null, "showMaxLabel": null, "margin": 8, "textStyle": { "fontSize": 12 } }, "splitLine": { "show": true, "lineStyle": { "color": [ "#ccc" ], "width": 1, "type": "solid" } }, "boundaryGap": true, "axisTick": { "alignWithLabel": false, "interval": "auto", "show": true, "inside": false, "length": 5, "lineStyle": { "width": 1 } }, "show": true, "zlevel": 0, "z": 0, "inverse": false, "name": "", "nameLocation": "end", "nameRotate": null, "nameTruncate": { "maxWidth": null, "ellipsis": "...", "placeholder": "." }, "nameTextStyle": {}, "nameGap": 15, "silent": false, "triggerEvent": false, "tooltip": { "show": false }, "axisPointer": { "status": "hide", "value": 0, "seriesDataIndices": [ { "seriesIndex": 1, "dataIndexInside": 0, "dataIndex": 0 }, { "seriesIndex": 2, "dataIndexInside": 0, "dataIndex": 0 }, { "seriesIndex": 3, "dataIndexInside": 0, "dataIndex": 0 }, { "seriesIndex": 4, "dataIndexInside": 0, "dataIndex": 0 }, { "seriesIndex": 5, "dataIndexInside": 0, "dataIndex": 0 }, { "seriesIndex": 6, "dataIndexInside": 0, "dataIndex": 0 }, { "seriesIndex": 7, "dataIndexInside": 0, "dataIndex": 0 }, { "seriesIndex": 8, "dataIndexInside": 0, "dataIndex": 0 } ] }, "axisLine": { "show": true, "onZero": true, "lineStyle": { "color": "#333", "width": 1, "type": "solid" } }, "splitArea": { "show": false, "areaStyle": { "color": [ "rgba(250,250,250,0.3)", "rgba(200,200,200,0.3)" ] } }, "offset": 0, "rangeEnd": null, "rangeStart": null, "data": [ "Coco Xu", "Liu Bailiang", "Vivian Zhang", "Yu Miao" ] } ], "grid": [ { "show": false, "zlevel": 0, "z": 0, "left": "10%", "top": 60, "right": "10%", "bottom": 60, "containLabel": false, "backgroundColor": "rgba(0,0,0,0)", "borderWidth": 1, "borderColor": "#ccc" } ], "series": [ { "name": "项目占比", "type": "pie", "center": [ "80%", "20%" ], "radius": "20%", "z": 100, "zlevel": 0, "legendHoverLink": true, "hoverAnimation": true, "clockwise": true, "startAngle": 90, "minAngle": 0, "selectedOffset": 10, "avoidLabelOverlap": true, "percentPrecision": 2, "stillShowZeroSum": true, "label": { "normal": { "rotate": false, "show": true, "position": "outer" }, "emphasis": { "position": "outer", "show": true } }, "labelLine": { "normal": { "show": true, "length": 15, "length2": 15, "smooth": false, "lineStyle": { "width": 1, "type": "solid" } }, "emphasis": { "show": true } }, "itemStyle": { "normal": { "borderWidth": 1 }, "emphasis": {} }, "animationType": "expansion", "animationEasing": "cubicOut", "data": [ { "name": "free", "value": 25.3 }, { "name": "misc", "value": 15.35 }, { "name": "mya", "value": 6.9 }, { "name": "sdyx", "value": 16.5 }, { "name": "ss", "value": 9.5 }, { "name": "ygj", "value": 24.45 }, { "name": "yys_previz", "value": 62.9 } ] }, { "name": "总计timelog", "type": "line", "z": 100, "data": [ 36.3, 40.2, 40.4, 44 ], "zlevel": 0, "coordinateSystem": "cartesian2d", "legendHoverLink": true, "hoverAnimation": true, "clipOverflow": true, "label": { "normal": { "position": "top" }, "emphasis": { "position": "top" } }, "lineStyle": { "normal": { "width": 2, "type": "solid" } }, "step": false, "smooth": false, "smoothMonotone": null, "symbol": "emptyCircle", "symbolSize": 4, "symbolRotate": null, "showSymbol": true, "showAllSymbol": false, "connectNulls": false, "sampling": "none", "animationEasing": "linear", "progressive": 0, "hoverLayerThreshold": null }, { "name": "free", "type": "bar", "data": [ 12.7, 0, 4.8, 7.8 ], "markLine": { "data": [ { "yAxis": 40 } ] }, "zlevel": 0, "z": 2, "coordinateSystem": "cartesian2d", "legendHoverLink": true, "barMinHeight": 0, "barMinAngle": 0, "itemStyle": { "normal": {}, "emphasis": {} } }, { "name": "misc", "type": "bar", "data": [ 0.2, 8.2, 0.25, 6.7 ], "markLine": { "data": [ { "yAxis": 40 } ] }, "zlevel": 0, "z": 2, "coordinateSystem": "cartesian2d", "legendHoverLink": true, "barMinHeight": 0, "barMinAngle": 0, "itemStyle": { "normal": {}, "emphasis": {} } }, { "name": "mya", "type": "bar", "data": [ 6.9, 0, 0, 0 ], "markLine": { "data": [ { "yAxis": 40 } ] }, "zlevel": 0, "z": 2, "coordinateSystem": "cartesian2d", "legendHoverLink": true, "barMinHeight": 0, "barMinAngle": 0, "itemStyle": { "normal": {}, "emphasis": {} } }, { "name": "sdyx", "type": "bar", "data": [ 10.5, 6, 0, 0 ], "markLine": { "data": [ { "yAxis": 40 } ] }, "zlevel": 0, "z": 2, "coordinateSystem": "cartesian2d", "legendHoverLink": true, "barMinHeight": 0, "barMinAngle": 0, "itemStyle": { "normal": {}, "emphasis": {} } }, { "name": "ss", "type": "bar", "data": [ 1, 0, 0, 8.5 ], "markLine": { "data": [ { "yAxis": 40 } ] }, "zlevel": 0, "z": 2, "coordinateSystem": "cartesian2d", "legendHoverLink": true, "barMinHeight": 0, "barMinAngle": 0, "itemStyle": { "normal": {}, "emphasis": {} } }, { "name": "ygj", "type": "bar", "data": [ 0, 0, 24.45, 0 ], "markLine": { "data": [ { "yAxis": 40 } ] }, "zlevel": 0, "z": 2, "coordinateSystem": "cartesian2d", "legendHoverLink": true, "barMinHeight": 0, "barMinAngle": 0, "itemStyle": { "normal": {}, "emphasis": {} } }, { "name": "yys_previz", "type": "bar", "data": [ 5, 26, 10.9, 21 ], "markLine": { "data": [ { "yAxis": 40 } ] }, "zlevel": 0, "z": 2, "coordinateSystem": "cartesian2d", "legendHoverLink": true, "barMinHeight": 0, "barMinAngle": 0, "itemStyle": { "normal": {}, "emphasis": {} } } ], "markArea": [ { "zlevel": 0, "z": 1, "tooltip": { "trigger": "item" }, "animation": false, "label": { "normal": { "show": true, "position": "top" }, "emphasis": { "show": true, "position": "top" } }, "itemStyle": { "normal": { "borderWidth": 0 } } } ], "markLine": [ { "zlevel": 0, "z": 5, "symbol": [ "circle", "arrow" ], "symbolSize": [ 8, 16 ], "precision": 2, "tooltip": { "trigger": "item" }, "label": { "normal": { "show": true, "position": "end" }, "emphasis": { "show": true } }, "lineStyle": { "normal": { "type": "dashed" }, "emphasis": { "width": 3 } }, "animationEasing": "linear" } ], "markPoint": [ { "zlevel": 0, "z": 5, "symbol": "pin", "symbolSize": 50, "tooltip": { "trigger": "item" }, "label": { "normal": { "show": true, "position": "inside" }, "emphasis": { "show": true } }, "itemStyle": { "normal": { "borderWidth": 2 } } } ], "marker": [], "visualMap": [], "dataZoom": [ { "type": "inside", "zlevel": 0, "z": 4, "orient": "horizontal", "xAxisIndex": [ 0 ], "yAxisIndex": [], "filterMode": "filter", "throttle": 100, "start": 0, "end": 100, "startValue": 0, "endValue": 3, "minSpan": null, "maxSpan": null, "minValueSpan": null, "maxValueSpan": null, "disabled": false, "zoomLock": false, "zoomOnMouseWheel": true, "moveOnMouseMove": true, "preventDefaultMouseMove": true, "zAxisIndex": [], "radiusAxisIndex": [], "angleAxisIndex": [], "singleAxisIndex": [] }, { "type": "slider", "filterMode": "weakFilter", "showDataShadow": false, "top": 780, "height": 10, "borderColor": "transparent", "backgroundColor": "#e2e2e2", "handleIcon": "M10.7,11.9H9.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4h1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7v-1.2h6.6z M13.3,22H6.7v-1.2h6.6z M13.3,19.6H6.7v-1.2h6.6z", "handleSize": 20, "handleStyle": { "shadowBlur": 6, "shadowOffsetX": 1, "shadowOffsetY": 2, "shadowColor": "#aaa", "color": "#a7b7cc" }, "labelFormatter": "", "zlevel": 0, "z": 4, "orient": "horizontal", "xAxisIndex": [ 0 ], "yAxisIndex": [], "throttle": 100, "start": 0, "end": 100, "startValue": 0, "endValue": 3, "minSpan": null, "maxSpan": null, "minValueSpan": null, "maxValueSpan": null, "show": true, "right": "ph", "width": "ph", "left": null, "bottom": null, "dataBackground": { "lineStyle": { "color": "#2f4554", "width": 0.5, "opacity": 0.3 }, "areaStyle": { "color": "rgba(47,69,84,0.3)", "opacity": 0.3 } }, "fillerColor": "rgba(167,183,204,0.4)", "labelPrecision": null, "showDetail": true, "realtime": true, "zoomLock": false, "textStyle": { "color": "#333" }, "zAxisIndex": [], "radiusAxisIndex": [], "angleAxisIndex": [], "singleAxisIndex": [] } ], "brush": [], "legend": [ { "x": "center", "y": "bottom", "top": 30, "left": "center", "zlevel": 0, "z": 4, "show": true, "orient": "horizontal", "align": "auto", "backgroundColor": "rgba(0,0,0,0)", "borderColor": "#ccc", "borderWidth": 0, "padding": 5, "itemGap": 10, "itemWidth": 25, "itemHeight": 14, "inactiveColor": "#ccc", "textStyle": { "color": "#333" }, "selectedMode": true, "tooltip": { "show": false }, "right": null, "bottom": null, "selected": {}, "data": [ "free", "misc", "mya", "sdyx", "ss", "ygj", "yys_previz" ] } ] }
