154 lines
3.1 KiB
TypeScript
154 lines
3.1 KiB
TypeScript
export let pieOption = {
|
||
// 定义中心文字
|
||
graphic: [
|
||
{
|
||
type: 'text',
|
||
left: 'center',
|
||
top: '40%',
|
||
style: {
|
||
// 需要从接口替换
|
||
text: '70%',
|
||
fontSize: 24,
|
||
fontWeight: 'bold',
|
||
fill: '#fff'
|
||
}
|
||
},
|
||
{
|
||
type: 'text',
|
||
left: 'center',
|
||
top: '50%',
|
||
style: {
|
||
text: '总进度',
|
||
fontSize: 14,
|
||
fill: '#fff'
|
||
}
|
||
},
|
||
],
|
||
legend: {
|
||
show: true,
|
||
type: 'plain',
|
||
bottom: 20,
|
||
itemWidth: 12,
|
||
itemHeight: 12,
|
||
textStyle: {
|
||
color: '#fff'
|
||
}
|
||
},
|
||
series: {
|
||
type: 'pie',
|
||
data: [],
|
||
radius: [50, 80],
|
||
center: ['50%', '45%'],
|
||
itemStyle: {
|
||
borderColor: '#fff',
|
||
borderWidth: 1
|
||
},
|
||
label: {
|
||
alignTo: 'edge',
|
||
formatter: '{name|{b}}\n{percent|{c} %}',
|
||
minMargin: 10,
|
||
edgeDistance: 20,
|
||
lineHeight: 15,
|
||
rich: {
|
||
name: {
|
||
fontSize: 12,
|
||
color: '#fff'
|
||
},
|
||
percent: {
|
||
fontSize: 12,
|
||
color: '#fff'
|
||
}
|
||
}
|
||
},
|
||
legend: {
|
||
top: 'bottom'
|
||
},
|
||
}
|
||
};
|
||
|
||
export let barOption = {
|
||
legend: {
|
||
icon: 'rect',
|
||
itemWidth: 12,
|
||
itemHeight: 12,
|
||
// 调整文字与图标间距
|
||
data: ['计划流转面积', '已流转面积'],
|
||
top: 0,
|
||
right: 20,
|
||
textStyle: {
|
||
color: '#fff',
|
||
}
|
||
},
|
||
xAxis: {
|
||
type: 'category',
|
||
data: ['地块1', '地块2', '地块3', '地块4', '地块5', '地块6'],
|
||
axisLabel: {
|
||
color: '#fff'
|
||
},
|
||
axisLine: {
|
||
show: false
|
||
},
|
||
splitLine: {
|
||
show: false
|
||
}
|
||
},
|
||
yAxis: {
|
||
name: '单位：m²',
|
||
type: 'value',
|
||
axisLabel: {
|
||
formatter: '{value}'
|
||
}
|
||
},
|
||
grid: {
|
||
bottom: 0, // 距离容器底部的距离
|
||
containLabel: true // 确保坐标轴标签不被裁剪
|
||
},
|
||
series: [
|
||
{
|
||
name: '计划流转面积',
|
||
type: 'bar',
|
||
data: [],
|
||
barWidth: '20%',
|
||
itemStyle: {
|
||
color: 'rgb(29, 253, 253)'
|
||
},
|
||
},
|
||
{
|
||
name: '已流转面积',
|
||
type: 'bar',
|
||
data: [],
|
||
barWidth: '20%',
|
||
itemStyle: {
|
||
color: 'rgb(25, 181, 251)'
|
||
},
|
||
}
|
||
]
|
||
};
|
||
|
||
export let mapOption = {
|
||
geo: {
|
||
map: 'ch',
|
||
roam: true,
|
||
aspectScale: Math.cos((47 * Math.PI) / 180),
|
||
},
|
||
series: [
|
||
{
|
||
type: 'graph',
|
||
coordinateSystem: 'geo',
|
||
data: [
|
||
{ name: 'a', value: [7.667821250000001, 46.791734269956265] },
|
||
{ name: 'b', value: [7.404848750000001, 46.516308805996054] },
|
||
{ name: 'c', value: [7.376673125000001, 46.24728858538375] },
|
||
{ name: 'd', value: [8.015320625000001, 46.39460918238572] },
|
||
{ name: 'e', value: [8.616400625, 46.7020608630855] },
|
||
{ name: 'f', value: [8.869981250000002, 46.37539345234199] },
|
||
{ name: 'g', value: [9.546196250000001, 46.58676648282309] },
|
||
{ name: 'h', value: [9.311399375, 47.182454114178896] },
|
||
{ name: 'i', value: [9.085994375000002, 47.55395822835779] },
|
||
{ name: 'j', value: [8.653968125000002, 47.47709530818285] },
|
||
{ name: 'k', value: [8.203158125000002, 47.44506909144329] }
|
||
],
|
||
}
|
||
]
|
||
};
|