|
| 1 | +// 示例数据用于测试各种图表 |
| 2 | + |
| 3 | +export const barChartData = [ |
| 4 | + { category: "苹果", value: 120 }, |
| 5 | + { category: "香蕉", value: 80 }, |
| 6 | + { category: "橙子", value: 150 }, |
| 7 | + { category: "葡萄", value: 90 }, |
| 8 | +]; |
| 9 | + |
| 10 | +export const lineChartData = [ |
| 11 | + { time: "2023-01", value: 100 }, |
| 12 | + { time: "2023-02", value: 120 }, |
| 13 | + { time: "2023-03", value: 85 }, |
| 14 | + { time: "2023-04", value: 160 }, |
| 15 | + { time: "2023-05", value: 140 }, |
| 16 | +]; |
| 17 | + |
| 18 | +export const pieChartData = [ |
| 19 | + { category: "技术", value: 35 }, |
| 20 | + { category: "营销", value: 25 }, |
| 21 | + { category: "销售", value: 20 }, |
| 22 | + { category: "客服", value: 20 }, |
| 23 | +]; |
| 24 | + |
| 25 | +export const radarChartData = [ |
| 26 | + { name: "性能", value: 85 }, |
| 27 | + { name: "功能", value: 90 }, |
| 28 | + { name: "易用性", value: 75 }, |
| 29 | + { name: "稳定性", value: 95 }, |
| 30 | + { name: "价格", value: 60 }, |
| 31 | +]; |
| 32 | + |
| 33 | +export const scatterChartData = [ |
| 34 | + { x: 10, y: 15 }, |
| 35 | + { x: 20, y: 25 }, |
| 36 | + { x: 30, y: 35 }, |
| 37 | + { x: 40, y: 30 }, |
| 38 | + { x: 50, y: 45 }, |
| 39 | +]; |
| 40 | + |
| 41 | +export const sankeyChartData = [ |
| 42 | + { source: "访问首页", target: "产品页面", value: 1000 }, |
| 43 | + { source: "产品页面", target: "添加购物车", value: 300 }, |
| 44 | + { source: "添加购物车", target: "结算", value: 200 }, |
| 45 | + { source: "结算", target: "完成购买", value: 150 }, |
| 46 | +]; |
| 47 | + |
| 48 | +export const funnelChartData = [ |
| 49 | + { category: "访问网站", value: 1000 }, |
| 50 | + { category: "浏览产品", value: 800 }, |
| 51 | + { category: "添加购物车", value: 600 }, |
| 52 | + { category: "开始结算", value: 400 }, |
| 53 | + { category: "完成购买", value: 300 }, |
| 54 | +]; |
| 55 | + |
| 56 | +export const gaugeChartData = [{ name: "CPU使用率", value: 75 }]; |
| 57 | + |
| 58 | +export const treemapChartData = [ |
| 59 | + { |
| 60 | + name: "技术部门", |
| 61 | + value: 100, |
| 62 | + children: [ |
| 63 | + { name: "前端", value: 40 }, |
| 64 | + { name: "后端", value: 60 }, |
| 65 | + ], |
| 66 | + }, |
| 67 | + { |
| 68 | + name: "业务部门", |
| 69 | + value: 80, |
| 70 | + children: [ |
| 71 | + { name: "营销", value: 30 }, |
| 72 | + { name: "销售", value: 50 }, |
| 73 | + ], |
| 74 | + }, |
| 75 | +]; |
| 76 | + |
| 77 | +export const sunburstChartData = [ |
| 78 | + { |
| 79 | + name: "公司", |
| 80 | + value: 200, |
| 81 | + children: [ |
| 82 | + { |
| 83 | + name: "技术", |
| 84 | + value: 100, |
| 85 | + children: [ |
| 86 | + { name: "前端", value: 40 }, |
| 87 | + { name: "后端", value: 60 }, |
| 88 | + ], |
| 89 | + }, |
| 90 | + { |
| 91 | + name: "业务", |
| 92 | + value: 100, |
| 93 | + children: [ |
| 94 | + { name: "销售", value: 60 }, |
| 95 | + { name: "营销", value: 40 }, |
| 96 | + ], |
| 97 | + }, |
| 98 | + ], |
| 99 | + }, |
| 100 | +]; |
| 101 | + |
| 102 | +export const heatmapChartData = [ |
| 103 | + { x: "周一", y: "9点", value: 5 }, |
| 104 | + { x: "周一", y: "10点", value: 8 }, |
| 105 | + { x: "周二", y: "9点", value: 3 }, |
| 106 | + { x: "周二", y: "10点", value: 7 }, |
| 107 | + { x: "周三", y: "9点", value: 9 }, |
| 108 | + { x: "周三", y: "10点", value: 6 }, |
| 109 | +]; |
| 110 | + |
| 111 | +export const candlestickChartData = [ |
| 112 | + { date: "2023-01-01", open: 100, high: 110, low: 95, close: 105 }, |
| 113 | + { date: "2023-01-02", open: 105, high: 115, low: 100, close: 108 }, |
| 114 | + { date: "2023-01-03", open: 108, high: 112, low: 102, close: 106 }, |
| 115 | + { date: "2023-01-04", open: 106, high: 118, low: 104, close: 115 }, |
| 116 | +]; |
| 117 | + |
| 118 | +export const boxplotChartData = [ |
| 119 | + { category: "A组", value: 10 }, |
| 120 | + { category: "A组", value: 12 }, |
| 121 | + { category: "A组", value: 15 }, |
| 122 | + { category: "A组", value: 18 }, |
| 123 | + { category: "A组", value: 20 }, |
| 124 | + { category: "B组", value: 8 }, |
| 125 | + { category: "B组", value: 11 }, |
| 126 | + { category: "B组", value: 14 }, |
| 127 | + { category: "B组", value: 16 }, |
| 128 | + { category: "B组", value: 22 }, |
| 129 | +]; |
| 130 | + |
| 131 | +export const graphChartData = { |
| 132 | + nodes: [ |
| 133 | + { id: "node1", name: "节点1" }, |
| 134 | + { id: "node2", name: "节点2" }, |
| 135 | + { id: "node3", name: "节点3" }, |
| 136 | + { id: "node4", name: "节点4" }, |
| 137 | + ], |
| 138 | + edges: [ |
| 139 | + { source: "node1", target: "node2" }, |
| 140 | + { source: "node2", target: "node3" }, |
| 141 | + { source: "node3", target: "node4" }, |
| 142 | + { source: "node1", target: "node4" }, |
| 143 | + ], |
| 144 | +}; |
| 145 | + |
| 146 | +export const parallelChartData = [ |
| 147 | + { name: "产品A", values: [4.2, 3.4, 2.3, 1.8] }, |
| 148 | + { name: "产品B", values: [3.8, 4.1, 3.2, 2.5] }, |
| 149 | + { name: "产品C", values: [2.9, 3.8, 4.1, 3.2] }, |
| 150 | +]; |
| 151 | + |
| 152 | +export const parallelDimensions = ["价格", "质量", "服务", "价值"]; |
| 153 | + |
| 154 | +export const treeChartData = { |
| 155 | + name: "根节点", |
| 156 | + children: [ |
| 157 | + { |
| 158 | + name: "子节点1", |
| 159 | + children: [{ name: "叶节点1" }, { name: "叶节点2" }], |
| 160 | + }, |
| 161 | + { |
| 162 | + name: "子节点2", |
| 163 | + children: [{ name: "叶节点3" }, { name: "叶节点4" }], |
| 164 | + }, |
| 165 | + ], |
| 166 | +}; |
| 167 | + |
| 168 | +export const echartsOption = { |
| 169 | + title: { |
| 170 | + text: "ECharts测试图表", |
| 171 | + left: "center", |
| 172 | + top: "2%", |
| 173 | + }, |
| 174 | + tooltip: {}, |
| 175 | + xAxis: { |
| 176 | + data: ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"], |
| 177 | + }, |
| 178 | + yAxis: {}, |
| 179 | + series: [ |
| 180 | + { |
| 181 | + name: "销量", |
| 182 | + type: "bar", |
| 183 | + data: [5, 20, 36, 10, 10, 20], |
| 184 | + }, |
| 185 | + ], |
| 186 | +}; |
0 commit comments