forked from Gitlink/forgeplus-react
58 lines
1.4 KiB
JavaScript
58 lines
1.4 KiB
JavaScript
import React, { useEffect, useState } from 'react';
|
|
import * as echarts from 'echarts';
|
|
|
|
function StackImg({x,values,title,id}){
|
|
useEffect(()=>{
|
|
if(x && values && x.length>0 && values.length>0){
|
|
Init(x,values)
|
|
}
|
|
},[x,values])
|
|
|
|
function Init(){
|
|
var huan_val = document.getElementById(id);
|
|
var myEcharts = echarts.init(huan_val);
|
|
let option = {
|
|
title: {
|
|
text: title || '',
|
|
textStyle:{
|
|
fontSize: 17 ,
|
|
fontWeight: 'normal',
|
|
},
|
|
left:20,
|
|
top:15
|
|
},
|
|
tooltip: {
|
|
trigger: 'axis'
|
|
},
|
|
color:['#5871FF',"#FFBE38"],
|
|
// legend: {
|
|
// data: ['Email', 'Union Ads']
|
|
// },
|
|
grid: {
|
|
left: '3%',
|
|
right: '4%',
|
|
bottom: '3%',
|
|
containLabel: true
|
|
},
|
|
// toolbox: {
|
|
// feature: {
|
|
// saveAsImage: {}
|
|
// }
|
|
// },
|
|
xAxis: {
|
|
type: 'category',
|
|
boundaryGap: false,
|
|
data: x
|
|
},
|
|
yAxis: {
|
|
type: 'value'
|
|
},
|
|
series: values
|
|
};
|
|
myEcharts.setOption(option);
|
|
}
|
|
return(
|
|
<div id={id} style={{height:"350px"}}></div>
|
|
)
|
|
}
|
|
export default StackImg; |