mirror of
https://github.com/ecomfe/vue-echarts.git
synced 2025-11-04 20:08:01 +08:00
55 lines
1.3 KiB
JavaScript
55 lines
1.3 KiB
JavaScript
Vue.createApp({
|
|
data() {
|
|
return {
|
|
option: {
|
|
textStyle: {
|
|
fontFamily: 'Inter, "Helvetica Neue", Arial, sans-serif'
|
|
},
|
|
title: {
|
|
text: "Traffic Sources",
|
|
left: "center"
|
|
},
|
|
tooltip: {
|
|
trigger: "item",
|
|
formatter: "{a} <br/>{b} : {c} ({d}%)"
|
|
},
|
|
legend: {
|
|
orient: "vertical",
|
|
left: "left",
|
|
data: [
|
|
"Direct",
|
|
"Email",
|
|
"Ad Networks",
|
|
"Video Ads",
|
|
"Search Engines"
|
|
]
|
|
},
|
|
series: [
|
|
{
|
|
name: "Traffic Sources",
|
|
type: "pie",
|
|
radius: "55%",
|
|
center: ["50%", "60%"],
|
|
data: [
|
|
{ value: 335, name: "Direct" },
|
|
{ value: 310, name: "Email" },
|
|
{ value: 234, name: "Ad Networks" },
|
|
{ value: 135, name: "Video Ads" },
|
|
{ value: 1548, name: "Search Engines" }
|
|
],
|
|
emphasis: {
|
|
itemStyle: {
|
|
shadowBlur: 10,
|
|
shadowOffsetX: 0,
|
|
shadowColor: "rgba(0, 0, 0, 0.5)"
|
|
}
|
|
}
|
|
}
|
|
]
|
|
}
|
|
};
|
|
}
|
|
})
|
|
.component("v-chart", VueECharts)
|
|
.mount("#app");
|