
echartOption: {
grid: {
left: 0,
right: 0,
top: 60,
bottom: 16,
// 是否显示刻度标签 如果是true 就显示 否则反之
containLabel: true,
},
tooltip: {
trigger: 'axis',
axisPointer: {
// 坐标轴指示器,坐标轴触发有效
type: 'none', // 默认为直线,可选为:'line' | 'shadow'
},
confine: true,
backgroundColor: 'rgba(255, 255, 255, 0.94)',
borderWidth: 1,
borderColor: '#F4F4F4',
borderRadius: 6,
boxShadow: '0px 2px 4px rgba(207, 149, 104, 1)',
padding: 10,
textStyle: {
color: '#333',
},
formatter: (params) => {
if (params[0].value == 0) return
let level = this.echartData[params[0].dataIndex].level
let total = this.echartData[params[0].dataIndex].total
let str = `<p>徐州市</p><p>${params[0].name}</p>
<p><span>${params[0].marker}排名:</span>第${level}名</p>
<p><span>${params[0].marker}得分:</span>${total}</p>`
return str
},
},
xAxis: {
type: 'category',
boundaryGap: true,
data: [],
axisTick: {
show: false, //不显示坐标轴刻度
},
axisLine: {
show: false, //不显示坐标轴轴线
},
// 坐标轴文字样式
axisLabel: {
interval: 0,
fontSize: 14,
fontFamily: 'Microsoft YaHei',
},
},
yAxis: {
type: 'value',
axisLabel: {
show: false, //不显示刻度标签
},
axisTick: {
show: false, //不显示坐标轴刻度
},
axisLine: {
show: false, //不显示坐标轴轴线
},
splitLine: {
lineStyle: {
// 分隔线颜色,可以设置成单个颜色。
// 也可以设置成颜色数组,分隔线会按数组中颜色的顺序依次循环设置颜色。
color: '#F4F4F4',
},
},
},
series: [
{
data: [],
type: 'line',
symbol: 'circle',
symbolSize: 8,
itemStyle: {
color: this.$eachrtColor.green,
borderColor: '#fff',
borderWidth: 2,
},
lineStyle: {
width: 2,
color: this.$eachrtColor.green,
},
label: {
show: true,
position: 'top',
fontSize: 10,
formatter: (params) => {
console.log(params)
console.log(this.rankLength)
if (params.value == 0) return '暂无数据'
let level = 1 - params.value + this.rankLength
return '第' + level + '名'
},
},
},
],
},