const createSvg = (shadowColor, shadowBlur) => ` `; const svgString = createSvg('#156dff', 8); const svg = new Blob([svgString], {type: "image/svg+xml;charset=utf-8"}); const DOMURL = window.URL || window.webkitURL || window; const insetShadowUrl = DOMURL.createObjectURL(svg); const dataSet = [ ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'], [120, 200, 150, 80, 70, 110, 130] ]; option = { backgroundColor: '#101631', xAxis: { type: 'category', axisLine: { show: false, }, axisTick: { show: false, }, axisLabel: { color: 'rgba(255,255,255, 0.5)', }, splitLine: { show: false, }, data: dataSet[0], }, yAxis: { type: 'value', axisLine: { show: false, }, axisTick: { show: false, }, axisLabel: { color: 'rgba(255,255,255, 0.5)', }, splitLine: { show: true, lineStyle: { type: 'dashed', color: 'rgba(255,255,255,0.1)', width: 2, }, }, }, series: [ { data: dataSet[1], type: 'pictorialBar', symbol: 'image://' + insetShadowUrl, barWidth: 50, }, { data: dataSet[1], type: 'bar', barWidth: 50, itemStyle: { color: 'transparent', borderWidth: 3, borderColor: new echarts.graphic.LinearGradient( 0, 0, 0, 1, [{ offset: 0, color: '#156dff' }, { offset: 1, color: '#00eaeb' }, ] ), shadowColor: 'blue', shadowBlur: 12, shadowOffsetX: 0, shadowOffsetY: 0, }, }, ], };

Echarts在线免费图表