this is put separately in a js file, and then the error message cannot be found in the component. How can the data in it be sent to the data corresponding to option after it is obtained from the backend server? all the data is dynamic
export const option = {
title: [
{
text: ""
},
{
text: total.value,
left: "30%",
top: "46%",
textAlign: "center",
textBaseline: "middle",
textStyle: {
color: "-sharp8483EF",
fontWeight: "normal",
fontSize: 42
}
},
{
text: total.name,
left: "30%",
top: "55%",
textAlign: "center",
textBaseline: "middle",
textStyle: {
color: "-sharp999",
fontWeight: "normal",
fontSize: 20
}
}],
tooltip: {
trigger: "item",
formatter: "{b}",
backgroundColor: "rgba(0,0,0,0.7)", //
padding: [8, 10] //},
legend: {
orient: "",
icon: "circle",
right: 100,
top: "center",
itemGap: 18,
textStyle: {
color: "-sharp666",
fontSize: 16
},
// formatter: function (series) {
// return series[0].data[0].value
// },
data: data_name},
/ / graphic: {
/ / type: "text",
/ / left: "22%", / / relative parent element
/ / top: "middle", / / relative parent element
/ / padding: [10,10],
/ / style: {
/ / fill: "- sharp777",
/ / textAlign: "center",
/ / text: ["Total number of 2000n vehicles"],
/ / font: "30px Microsoft YaHei"
/ /}
/ /},
series: [
{
type: "pie",
radius: [146, 160],
center: ["30%", "50%"],
color: "blue",
hoverAnimation: false,
avoidLabelOverlap: false,
label: {
normal: {
show: false,
position: "center"
},
formatter: `{value} `
},
data: originalData
// data: [
// {
// value: 150,
// name: "",
// itemStyle: {
// color: "blue"
// }
// },
// {
// value: 150,
// name: "",
// itemStyle: {
// color: "pink"
// }
// },
// {
// value: 150,
// name: "",
// itemStyle: {
// color: "purple"
// }
// },
// {
// value: 150,
// name: "",
// itemStyle: {
// color: "hotpink"
// }
// },
// {
// value: 150,
// name: "",
// itemStyle: {
// color: "skyblue"
// }
// },
// {
// value: 1000,
// name: "",
// itemStyle: {
// color: "lightgreen"
// }
// }
// ]
}]
}