原來不能理所當然,認為單個area與mix里的area用法一樣!!可能作者實現還有問題,導致單個area的頂部折線是用extra配置的,而mix圖里,頂部折線是用相同數據源的line直接繪制出來的。我暈,搞了我1天,一直以為配置有問題,原來是uCharts的實現不夠優雅!!
單個,只需配置 addLine: true
extra: { area: { type: 'straight', opacity: 0.2, addLine: true, width: 4, gradien:true } }
混合圖里,區域圖的標准數據源如下:
一開始,按照單個的思路設置type='area',出來的效果如下:
let mixData = { "categories": [ "2012", "2013", "2014", "2015", "2016", "2017" ], "series": [{ "name": "曲面", "data": [ 70, 50, 85, 130, 64, 88 ], "type": "area", "style": "curve" }, { "name": "曲線", "data": [ 70, 50, 85, 130, 64, 88 ], "type": "line", "style": "curve", "color": "#1890ff", "disableLegend": false } ] }
最后ok了,媽的!!