120 lines
2.5 KiB
TypeScript
120 lines
2.5 KiB
TypeScript
export default function getOptions(chartData: any) {
|
|
if (Object.keys(chartData).length === 0) {
|
|
return null;
|
|
}
|
|
const colors = ["#1A99FF", "#FFB70C", "#C69DFF", "#50F4E3", "#E02094"];
|
|
return {
|
|
color: colors,
|
|
grid: { top: 38, right: 12, bottom: 26, left: 48 },
|
|
legend: {
|
|
show: true,
|
|
top: 10,
|
|
right: 10,
|
|
padding: 0,
|
|
itemWidth: 14,
|
|
itemHeight: 10,
|
|
itemGap: 8,
|
|
height: 10,
|
|
textStyle: {
|
|
color: "#DFF1FE",
|
|
fontSize: 14,
|
|
},
|
|
},
|
|
xAxis: {
|
|
type: "category",
|
|
data: ["8/22", "8/23", "8/24", "8/25", "8/26", "8/27", "8/28"],
|
|
// data: Array(7)
|
|
// .fill(1)
|
|
// .map((_, index) => {
|
|
// const today = new Date();
|
|
// const dtimestamp =
|
|
// today.getTime() - (index + 1) * 24 * 60 * 60 * 1000;
|
|
// return `${new Date(dtimestamp).getMonth() + 1}.${new Date(
|
|
// dtimestamp
|
|
// ).getDate()}`;
|
|
// })
|
|
// .reverse(),
|
|
axisLabel: {
|
|
color: "#fff",
|
|
fontSize: 14,
|
|
},
|
|
axisTick: { show: false },
|
|
axisLine: {
|
|
lineStyle: {
|
|
width: 2,
|
|
color: "#5982B2",
|
|
},
|
|
},
|
|
},
|
|
yAxis: {
|
|
name: "单位/%",
|
|
min: 50,
|
|
nameTextStyle: {
|
|
color: "#fff",
|
|
fontSize: 14,
|
|
},
|
|
type: "value",
|
|
axisLabel: {
|
|
color: "#fff",
|
|
fontSize: 14,
|
|
formatter: "{value}",
|
|
},
|
|
axisLine: {
|
|
show: true,
|
|
lineStyle: {
|
|
width: 2,
|
|
color: "#5982B2",
|
|
},
|
|
},
|
|
splitLine: {
|
|
lineStyle: {
|
|
width: 2,
|
|
color: "#5982B2",
|
|
},
|
|
},
|
|
},
|
|
tooltip: {
|
|
trigger: "axis",
|
|
className: "luoyang-chart-tooltip",
|
|
show: false,
|
|
},
|
|
series: [
|
|
{
|
|
name: "产线1",
|
|
type: "line",
|
|
symbol: "circle",
|
|
symbolSize: 4,
|
|
data: chartData.yData1,
|
|
},
|
|
{
|
|
name: "产线2",
|
|
type: "line",
|
|
symbol: "circle",
|
|
symbolSize: 4,
|
|
data: chartData.yData2,
|
|
},
|
|
{
|
|
name: "产线3",
|
|
type: "line",
|
|
symbol: "circle",
|
|
symbolSize: 4,
|
|
data: chartData.yData3,
|
|
},
|
|
{
|
|
name: "产线4",
|
|
type: "line",
|
|
symbol: "circle",
|
|
symbolSize: 4,
|
|
data: chartData.yData4,
|
|
},
|
|
{
|
|
name: "产线5",
|
|
type: "line",
|
|
symbol: "circle",
|
|
symbolSize: 4,
|
|
data: chartData.yData5,
|
|
},
|
|
],
|
|
};
|
|
}
|