【update】-大屏-iso\wp29横坐标倾斜
This commit is contained in:
fengchenchen
@@ -66,7 +66,8 @@ export default {
|
||||
tooltip: {
|
||||
formatter: params => {
|
||||
// 获取xAxis data中的数据
|
||||
let dataStr = `<div style="color:#333;margin-left: 8px;font-size: 14px;margin-bottom: 10px;">${tooltipTitle}</div>`
|
||||
let dataStr = `<div style="color:#333;margin-left: 8px;font-size: 14px;">${tooltipTitle}</div>`
|
||||
dataStr += `<div style="color:#333;margin-left: 8px;font-size: 14px;margin-bottom: 10px;">${params[0].name}</div>`
|
||||
params.forEach(item => {
|
||||
let color = ''
|
||||
if(typeof item.color === 'string') {
|
||||
@@ -102,36 +103,45 @@ export default {
|
||||
},
|
||||
xAxis: {
|
||||
axisLabel: {
|
||||
rotate: -10,
|
||||
align: 'center',
|
||||
verticalAlign : 'top',
|
||||
margin: 12,
|
||||
formatter: function(params) {
|
||||
let newParamsName = '' // 最终拼接成的字符串
|
||||
let paramsNameNumber = params.length // 实际标签的个数
|
||||
let provideNumber = 6 // 每行能显示的字的个数
|
||||
let rowNumber = Math.ceil(paramsNameNumber / provideNumber) // 换行的话，需要显示几行，向上取整
|
||||
/**
|
||||
* 判断标签的个数是否大于规定的个数， 如果大于，则进行换行处理 如果不大于，即等于或小于，就返回原标签
|
||||
*/
|
||||
// 条件等同于rowNumber>1
|
||||
if (paramsNameNumber > provideNumber) {
|
||||
/** 循环每一行,p表示行 */
|
||||
for (let p = 0; p < rowNumber; p++) {
|
||||
let tempStr = ''// 表示每一次截取的字符串
|
||||
let start = p * provideNumber // 开始截取的位置
|
||||
let end = start + provideNumber // 结束截取的位置
|
||||
// 此处特殊处理最后一行的索引值
|
||||
if (p === rowNumber - 1) {
|
||||
// 最后一次不换行
|
||||
tempStr = params.substring(start, paramsNameNumber)
|
||||
} else {
|
||||
// 每一次拼接字符串并换行
|
||||
tempStr = params.substring(start, end) + '\n'
|
||||
}
|
||||
newParamsName += tempStr // 最终拼成的字符串
|
||||
}
|
||||
if (params.length > 8) {
|
||||
return `${params.slice(0, 8)}...`
|
||||
} else {
|
||||
// 将旧标签的值赋给新标签
|
||||
newParamsName = params
|
||||
return params
|
||||
}
|
||||
return newParamsName
|
||||
// let newParamsName = '' // 最终拼接成的字符串
|
||||
// let paramsNameNumber = params.length // 实际标签的个数
|
||||
// let provideNumber = 6 // 每行能显示的字的个数
|
||||
// let rowNumber = Math.ceil(paramsNameNumber / provideNumber) // 换行的话，需要显示几行，向上取整
|
||||
// /**
|
||||
// * 判断标签的个数是否大于规定的个数， 如果大于，则进行换行处理 如果不大于，即等于或小于，就返回原标签
|
||||
// */
|
||||
// // 条件等同于rowNumber>1
|
||||
// if (paramsNameNumber > provideNumber) {
|
||||
// /** 循环每一行,p表示行 */
|
||||
// for (let p = 0; p < rowNumber; p++) {
|
||||
// let tempStr = ''// 表示每一次截取的字符串
|
||||
// let start = p * provideNumber // 开始截取的位置
|
||||
// let end = start + provideNumber // 结束截取的位置
|
||||
// // 此处特殊处理最后一行的索引值
|
||||
// if (p === rowNumber - 1) {
|
||||
// // 最后一次不换行
|
||||
// tempStr = params.substring(start, paramsNameNumber)
|
||||
// } else {
|
||||
// // 每一次拼接字符串并换行
|
||||
// tempStr = params.substring(start, end) + '\n'
|
||||
// }
|
||||
// newParamsName += tempStr // 最终拼成的字符串
|
||||
// }
|
||||
// } else {
|
||||
// // 将旧标签的值赋给新标签
|
||||
// newParamsName = params
|
||||
// }
|
||||
// return newParamsName
|
||||
}
|
||||
},
|
||||
data: xData,
|
||||
|
||||
@@ -72,6 +72,19 @@ export default {
|
||||
top : '20'
|
||||
},
|
||||
xAxis: {
|
||||
axisLabel: {
|
||||
rotate: -10,
|
||||
align: 'center',
|
||||
verticalAlign : 'top',
|
||||
margin: 12,
|
||||
formatter: (params) => {
|
||||
if (params.length > 8) {
|
||||
return `${params.slice(0, 8)}...`
|
||||
} else {
|
||||
return params
|
||||
}
|
||||
}
|
||||
},
|
||||
data: xData
|
||||
},
|
||||
series: [
|
||||
|
||||
@@ -233,7 +233,8 @@ export default {
|
||||
tooltip: {
|
||||
formatter: params => {
|
||||
// 获取xAxis data中的数据
|
||||
let dataStr = `<div style="color:#333;margin-left: 8px;font-size: 14px;margin-bottom: 10px;">${tooltipTitle}</div>`
|
||||
let dataStr = `<div style="color:#333;margin-left: 8px;font-size: 14px;">${tooltipTitle}</div>
|
||||
<div style="color:#333;margin-left: 8px;font-size: 14px;margin-bottom: 10px;">${params[0].name}</div>`
|
||||
params.forEach(item => {
|
||||
let color = ''
|
||||
if(typeof item.color === 'string') {
|
||||
@@ -268,6 +269,19 @@ export default {
|
||||
}
|
||||
},
|
||||
xAxis: {
|
||||
axisLabel: {
|
||||
rotate: -10,
|
||||
align: 'center',
|
||||
verticalAlign : 'top',
|
||||
margin: 12,
|
||||
formatter: (params) => {
|
||||
if (params.length > 8) {
|
||||
return `${params.slice(0, 8)}...`
|
||||
} else {
|
||||
return params
|
||||
}
|
||||
}
|
||||
},
|
||||
data: xData
|
||||
},
|
||||
series: [
|
||||
|
||||
@@ -257,7 +257,8 @@ export default {
|
||||
tooltip: {
|
||||
formatter: params => {
|
||||
// 获取xAxis data中的数据
|
||||
let dataStr = `<div style="color:#333;margin-left: 8px;font-size: 14px;margin-bottom: 10px;">${tooltipTitle}</div>`
|
||||
let dataStr = `<div style="color:#333;margin-left: 8px;font-size: 14px;">${tooltipTitle}</div>`
|
||||
dataStr += `<div style="color:#333;margin-left: 8px;font-size: 14px;margin-bottom: 10px;">${params[0].name}</div>`
|
||||
params.forEach(item => {
|
||||
let color = ''
|
||||
if(typeof item.color === 'string') {
|
||||
|
||||
@@ -93,6 +93,19 @@ export default {
|
||||
}
|
||||
},
|
||||
xAxis: {
|
||||
axisLabel: {
|
||||
rotate: -10,
|
||||
align: 'center',
|
||||
verticalAlign : 'top',
|
||||
margin: 12,
|
||||
formatter: function(params) {
|
||||
if (params.length > 8) {
|
||||
return `${params.slice(0, 8)}...`
|
||||
} else {
|
||||
return params
|
||||
}
|
||||
}
|
||||
},
|
||||
data: this.xAxisData
|
||||
},
|
||||
series: [
|
||||
|
||||
Reference in New Issue
Block a user