let echartData = {
barData: [
{
name: "i.o.innerhalb Tolerranz",
data: [68.4, 76.4, 82.5, 84.0, 85.9],
},
{
name: "Eingriffsgrenze 75% Toleranz",
data: [10.1, 12.8, 9.6, 9.1, 8.2],
},
{
name: "Ausserhalb Toleranz",
data: [21.5, 10.8, 7.9, 6.9, 5.9],
},
],
lineData: [
{
name: "基础目标 basic target",
data: [71, 71, 80, 80, 80, 80, 80, 90, 90, 90, 90, 90, 95, 95],
},
{
name: "挑战目标 challenge target",
data: [71, 73, 80, 80, 80, 80, 90, 90, 90, 90, 90, 95, 95, 95],
},
],
scheduleData: [
{ name: "VFF", data: [2] },
{ name: "PVS", data: [5] },
{ name: "0S", data: [4] },
{ name: "SOP", data: [2] },
],
}
option = {
//你的代码
color: ["#00b050", "#ffff00", "#ff0000", "#00b8a9", "#f6416c"],
title: {
text: "masse Grundgermetrie geasamt-Historle",
subtext: "Gesamt:588 Funktionmaße",
},
grid: [
{
left: 50,
right: 20,
top: 70,
bottom: "15%",
},
{
left: 50,
right: 20,
height: 40,
top: "90%",
},
],
tooltip: {
trigger: "axis",
confine: true,
appendToBody: true,
axisPointer: {
type: "shadow",
},
textStyle: {
align: "left",
},
},
yAxis: [
{
type: "value",
axisLabel: {
show: true,
interval: "auto",
formatter: "{value} %",
},
show: true,
},
{
type: "category",
data: ["Mon"],
gridIndex: 1,
boundaryGap: false,
splitLine: { show: false },
axisLabel: { show: false },
axisTick: { show: false },
axisLine: { lineStyle: { color: "#777" } },
},
],
xAxis: [
{
type: "category",
data: ["KW45",
"KW52",
"KW08",
"KW11",
"KW12",
"KW20",
"KW27",
"KW30",
"KW32",
"KW37",
"KW41",
"KW42",
"KW43",],
},
{
scale: true,
gridIndex: 1,
splitNumber: 2,
axisLabel: { show: false },
axisLine: { show: false },
axisTick: { show: false },
splitLine: { show: false },
max: 13,
},
],
series: [
{
name: echartData.barData[0].name,
type: "bar",
stack: "total",
barWidth: "40%",
label: {
show: true,
formatter: (params) => Math.round(params.value * 10) / 10,
},
data: echartData.barData[0].data,
},
{
name: echartData.barData[1].name,
type: "bar",
stack: "total",
barWidth: "40%",
label: {
show: true,
formatter: (params) => Math.round(params.value * 10) / 10,
},
data: echartData.barData[1].data,
},
{
name: echartData.barData[2].name,
type: "bar",
stack: "total",
barWidth: "40%",
label: {
show: true,
formatter: (params) => Math.round(params.value * 10) / 10,
},
data: echartData.barData[2].data,
},
{
name: echartData.lineData[0].name,
type: "line",
step: "middle",
label: {
show: false,
formatter: (params) => Math.round(params.value * 10) / 10 + "%",
},
data: echartData.lineData[0].data,
},
{
name: echartData.lineData[1].name,
type: "line",
step: "middle",
label: {
show: false,
formatter: (params) => Math.round(params.value * 10) / 10 + "%",
},
data: echartData.lineData[1].data,
},
{
name: echartData.scheduleData[0].name,
type: "bar",
stack: "schedule",
xAxisIndex: 1,
yAxisIndex: 1,
itemStyle: {
color: "#14b143",
borderWidth: 2,
borderColor: "#fff",
},
emphasis: {
itemStyle: {
color: "#140",
},
},
label: {
show: true,
formatter: (params) => params.seriesName,
},
tooltip: {
show: false,
},
data: echartData.scheduleData[0].data,
},
{
name: echartData.scheduleData[1].name,
type: "bar",
stack: "schedule",
xAxisIndex: 1,
yAxisIndex: 1,
itemStyle: {
color: "#14b143",
borderWidth: 2,
borderColor: "#fff",
},
emphasis: {
itemStyle: {
color: "#140",
},
},
label: {
show: true,
formatter: (params) => params.seriesName,
},
tooltip: {
show: false,
},
data: echartData.scheduleData[1].data,
},
{
name: echartData.scheduleData[2].name,
type: "bar",
stack: "schedule",
xAxisIndex: 1,
yAxisIndex: 1,
itemStyle: {
color: "#14b143",
borderWidth: 2,
borderColor: "#fff",
},
emphasis: {
itemStyle: {
color: "#140",
},
},
label: {
show: true,
formatter: (params) => params.seriesName,
},
tooltip: {
show: false,
},
data: echartData.scheduleData[2].data,
},
{
name: echartData.scheduleData[3].name,
type: "bar",
stack: "schedule",
xAxisIndex: 1,
yAxisIndex: 1,
itemStyle: {
color: "#14b143",
borderWidth: 2,
borderColor: "#fff",
},
emphasis: {
itemStyle: {
color: "#140",
},
},
label: {
show: true,
formatter: (params) => params.seriesName,
},
tooltip: {
show: false,
},
data: echartData.scheduleData[3].data,
},
],
};