//arr1是数据源
let set = $("#data").html();
$("#TestLogsData").html(set);
var list = set.split(',');
var arr1 = new Array(); //创建一个空数组
for (var i = 0; i < list.length; i++) {
arr1.push(Number(list[i]));
}
var total = 0;
for (var i = 0; i < arr1.length; i++) {
total += arr1[i];
}
var mCharts = echarts.init(document.getElementById('stesy'));
option = {
tooltip: {
trigger: 'axis',
position: function (pt) {
return [pt[0], '10%'];
}
},
title: {
left: 'center',
},
toolbox: {
feature: {
dataZoom: {
yAxisIndex: 'none'
},
restore: {},
saveAsImage: {}
}
},
xAxis: {
type: 'category',
boundaryGap: false,
data: arr1
},
yAxis: {
type: 'value',
boundaryGap: [0, '100%']
},
dataZoom: [
{
type: 'inside',
start: 0,
end: 10
},
{
start: 0,
end: 10
}
],
series: [
{
type: 'line',
symbol: 'none',
sampling: 'lttb',
itemStyle: {
color: 'rgb(26,179,148)'
},
areaStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{
offset: 0,
color: 'rgb(26,179,148)'
},
{
offset: 1,
color: 'rgb(26,179,148)'
}
])
},
data: arr1
}
]
};
//option = {
////title: {
//// text: '未来一周气温变化',
//// subtext: '纯属虚构'
////},
//tooltip: {
// trigger: 'axis'
//},
////legend: {
//// data: ['最高气温']
////},
//xAxis: {
// type: 'category',
// /* boundaryGap: false,*/
// data: arr1
//},
//yAxis: {
// min: Math.min.apply(Math, arr1),
// max: Math.max.apply(Math, arr1),
// type: 'value',
// axisLabel: {
// formatter: '{value} '
// }
//},
//series: [
// {
// type: 'bar',
// data: arr1,
// markLine: {
// data: [
// { type: 'average', name: '平均值', lineStyle: { color: 'green', type: 'solid', width: 4 } },
// { type: 'max', name: '最大值' },
// { type: 'min', name: '最小值' },
// ]
// },
// },
//]
//};
mCharts.setOption(option);
//mCharts.on('mousemove', function (params) {
// // 控制台打印数据的名称
// console.log(params);
///* console.log(arr1)*/
// var arr21 = new Array(); //创建一个空数组
// if (params.componentType == "series") {
// for (var i = 0; i <= params.dataIndex; i++) {
// arr21.push(arr1[i])
// }
// }
// if (arr21.length > 0) {
// let sun = 0;
// for (var i = 0; i < arr21.length; i++) {
// sun += arr21[i]
// }
// let pingjzhi = sun / arr21.length
// console.log(arr21)
// console.log(pingjzhi)
// }
//});
var app = new Vue({
el: '#app',
data: {
// 首页正态曲线的计算公式
mathJax: '`f(x) = (1 / (\sqrt {2\pi} \sigma)) e^(-(x-\mu)^2/(2\sigma^2))`',
// 数据源(从隔壁的 js 文件中引入)
json: {
"R1": [], "R2": [], "R3": [] },
// 页面中输入的数据。初始默认为 json 文件
input: '', // 数组的 watch 监听不太方便处理
// 是否为样本数据
isSample: true,
},
watch: {
// 监听输入框,即时更新图形
input: function (val) {
this.input = val;
this.loadChartsSeried() // 加载数据
this.initChartsData('chart') // 生成 Echarts 图
},
},
computed: {
/**
* @Description: 获取数据源
w
* @Date: 2020-11-27 14:56:w
* */
data: {
get() {
// 因为数组的监听不太好处理,所以多转换一次
return this.input.split(',').map(t => parseFloat(t))
},
set(v) {
// 如果给 data 赋值,只能是数组类型
if (!(v instanceof Array)) return
// 同步更新 input 的值
this.input = v.join(',')
}
},
/**
* @Description: 有序数据源(方便操作)
* @Date: 2020-11-28 14:17:24
* */
dataOrderBy() {
const data = this.data.concat([]); // 为防止 sort 方法修改原数组,对原数组进行拷贝,操作副本。
return data.sort((a, b) => a - b)
},
/**
* @Description: 数据整理。原数据整理为:{数据值 : 数据频率}
* @Date: 2020-11-28 13:59:12
* */
dataAfterClean() {
let res = {}
const data = this.dataOrderBy
for (let i = 0; i < this.data.length; i++) {
let key = parseFloat(this.data[i]).toFixed(1) // 这里保留 1 位小数
if (key !== "NaN" && parseFloat(key) === 0)
key = "0.0" //这个判断用来处理保留小数位后 -0.0 和 0.0 判定为不同 key 的 bug
if (res[key])
res[key] += 1
else
res[key] = 1
}
return res
},
/**
* @Description: 数据整理。返回源数据所有值(排序后)
* @Date: 2020-11-28 14:35:52
* */
dataAfterCleanX() {
return Object.keys(this.dataAfterClean).sort((a, b) => a - b).map(t => parseFloat(t)
.toFixed(1)) // 保留 1 位小数
// return Object.keys(this.dataAfterClean) // 不保证顺序一致
},
/**
* @Description: 数据整理。返回源数据所有值对应的频率(排序后) -- 与 dataAfterCleanX 顺序一致
* @Date: 2020-11-28 13:59:12
* */
dataAfterCleanY() {
let r = []
for (let i = 0; i < this.dataAfterCleanX.length; i++) {
r.push(this.dataAfterClean[this.dataAfterCleanX[i]])
}
return r
},
/**
* @Description: 数据整理。返回源数据所有值对应的频率,刻度更细致(保留 2 位小数) -- 与 dataAfterCleanX 顺序一致
* @Date: 2020-11-29 13:59:22
* */
dataAfterCleanXSub() {
let r = []
for (let i = parseFloat(this.min.toFixed(1)); i <= parseFloat(this.max.toFixed(1)); i +=
0.01)
r.push(i.toFixed(2))
//console.log(r)
return r
},
/**
* @Description: 计算平均数。这里的平均数指的是数学期望、算术平均数
* @Date: 2020-11-27 15:24:14
* */
sum() {
if (this.data.length === 0) return 0
return this.data.reduce((prev, curr) => prev + curr)
},
/**
* @Description: 计算平均数。这里的平均数指的是数学期望、算术平均数
* @Date: 2020-11-27 15:26:03
* */
average() {
return this.sum / this.data.length
},
/**
* @Description: 计算众数
* @Date: 2020-11-27 15:26:03
* */
mode() {
return 0
},
/**
* @Description: 计算中位数
* @Date: 2020-11-27 15:26:03
* */
median() {
const data = this.dataOrderBy
return (data[(data.length - 1) >> 1] + data[data.length >> 1]) / 2
},
/**
* @Description: 计算偏差
* @Date: 2020-11-27 15:26:03
* */
deviation() {
// 1、求平均数
const avg = this.average
// 2、返回偏差。 f(x) = x - avg
return this.data.map(x => x - avg)
},
/**
* @Description: 计算总体/样本方差
* @Date: 2020-11-27 15:26:03
* */
variance() {
if (this.data.length === 0) return 0
// 1、求偏差
const dev = this.deviation
// 2、求偏差平方和
const sumOfSquOfDev = dev.map(x => x * x).reduce((x, y) => x + y)
// 3、返回方差
return sumOfSquOfDev / (this.isSample ? (this.data.length - 1) : this.data.length)
},
/**
* @Description: 计算总体/样本标准差
* @Date: 2020-11-27 15:26:03
* */
standardDeviation() {
return Math.sqrt(this.variance)
},
/**
* @Description: 计算一倍标准差范围
* @Date: 2020-11-27 15:26:03
* */
standarDevRangeOfOne() {
return {
low: this.average - 1 * this.standardDeviation,
up: this.average + 1 * this.standardDeviation
}
},
/**
* @Description: 计算三倍标准差范围
* @Date: 2020-11-27 15:29:43
* */
standarDevRangeOfTwo() {
return {
low: this.average - 2 * this.standardDeviation,
up: this.average + 2 * this.standardDeviation
}
},
/**
* @Description: 计算三倍标准差范围
* @Date: 2020-11-27 15:30:49
* */
standarDevRangeOfThree() {
return {
low: this.average - 3 * this.standardDeviation,
up: this.average + 3 * this.standardDeviation
}
},
/**
* @Description: 计算最小值
* @Date: 2020-11-28 13:19:06
* */
min() {
return Math.min.apply(null, this.data)
},
/**
* @Description: 计算最大值
* @Date: 2020-11-28 13:21:16
* */
max() {
return Math.max.apply(null, this.data)
},
/**
* @Description: 正态分布(高斯分布)计算公式
* @Date: 2020-11-28 13:46:18
* */
normalDistribution() {
// 计算公式: `f(x) = (1 / (\sqrt {2\pi} \sigma)) e^(-(x-\mu)^2/(2\sigma^2))`
// return (1 / Math.sqrt(2 * Math.PI) * a) * (Math.exp(-1 * ((x - u) * (x - u)) / (2 * a * a)))
let res = []
for (let i = 0; i < this.dataAfterCleanX.length; i++) {
const x = this.dataAfterCleanX[i]
const a = this.standardDeviation
const u = this.average
const y = (1 / (Math.sqrt(2 * Math.PI) * a)) * (Math.exp(-1 * ((x - u) * (x - u)) / (2 *
a * a)))
res.push(y)
}
return res
},
//Averagemarks() {
// var yArr = [];
// var sumFuc = (s, c) => formulaCalcByFunc(s + c, 6);//求和匿名函数,formulaCalc为了减少精度误差,可以自己写;
// var ysum = this.data.reduce(sumFuc, 0)
// for (var n = 0; n < this.data.length; n++) {
// var y = this.data[n] / ysum;
// yArr.push(y);
// }
// var avg = math.mean(yArr);
//},
AveragemarksRang() {
return (this.max - this.min)/11;
},
},
created() {},
mounted() {
this.data = arr1;
this.loadChartsSeried() // 加载数据
this.initChartsData('chart') // 生成 Echarts 图
},
methods: {
numFilter(value) {
const realVal = parseFloat(value).toFixed(2);
return realVal;
},
/**
* @Description: 加载 Echarts 图所需数据
*
* @Params url
*
* @return
* @Date: 2020-11-27 13:24:26
* */
loadChartsSeried() {
this.json = this.json
},
/**
* @Description: 生成 Echarts 图
*
* @Params ref:容器
*
* @return
* @Date: 2020-11-27 13:23:26
* */
initChartsData(ref) {
let chart = this.$refs[ref]
if (!chart) return
chart = echarts.init(chart)
// Echarts 图的配置
let options = {
// Echarts 图 -- 标题
title: {
//text: 'Echarts 绘制正态分布曲线(有 3 组示例数据,刷新随机显示)'
},
// Echarts 图 -- 工具
tooltip: {},
// Echarts 图 -- 图例
legend: {
data: ['f(x)']
},
// Echarts 图 -- x 坐标轴刻度 -- 正态分布数值
xAxis: [{
// name : "标准刻度(0.1)",
data: this.dataAfterCleanX,
// min: this.min,
// max: this.max
}],
// Echarts 图 -- y 坐标轴刻度
yAxis: [{
type: 'value',
//name: '频数',
position: 'left',
// 网格线
splitLine: {
show: false
},
axisLine: {
lineStyle: {
color: 'orange'
}
},
axisLabel: {
formatter: '{value}'
}
},
{
type: 'value',
//name: '概率',
position: 'right',
// 网格线
splitLine: {
show: false
},
axisLine: {
lineStyle: {
color: 'black'
}
},
axisLabel: {
formatter: '{value}'
}
},
],
// Echarts 图 -- y 轴数据
series: [{
name: '源数据', // y 轴名称
type: 'bar', // y 轴类型
yAxisIndex: 0,
barGap: 0,
barWidth: 27,
itemStyle: {
normal: {
show: true,
color: '#1ab394', //柱子颜色
borderColor: '#FF7F50' //边框颜色
}
},
data: this.dataAfterCleanY, // y 轴数据 -- 源数据
}, {
name: '正态分布', // y 轴名称
type: 'line', // y 轴类型
symbol: 'none', //去掉折线图中的节点
smooth: true, //true 为平滑曲线
yAxisIndex: 1,
data: this.normalDistribution, // y 轴数据 -- 正态分布
// 警示线
markLine: {
symbol: ['none'], // 箭头方向
lineStyle: {
type: "silent",
color: "green",
},
itemStyle: {
normal: {
show: true,
color: 'black'
}
},
label: {
show: true,
position: "middle"
},
data: [{
name: '一倍标准差',
xAxis: this.standarDevRangeOfOne.low.toFixed(1),
// 当 n 倍标准差在坐标轴外时,将其隐藏,否则它会默认显示在最小值部分,容易引起混淆
lineStyle: {
opacity: (this.min > this.standarDevRangeOfOne
.low) ? 0 : 1
},
label: {
show: !(this.min > this.standarDevRangeOfOne.low)
}
}, {
name: '一倍标准差',
xAxis: this.standarDevRangeOfOne.up.toFixed(1),
lineStyle: {
opacity: (this.max < this.standarDevRangeOfOne.up) ?
0 : 1
},
label: {
show: !(this.max < this.standarDevRangeOfOne.up)
}
}, {
name: '二倍标准差',
xAxis: this.standarDevRangeOfTwo.low.toFixed(1),
lineStyle: {
opacity: (this.min > this.standarDevRangeOfTwo
.low) ? 0 : 1
},
label: {
show: !(this.min > this.standarDevRangeOfTwo.low)
}
}, {
name: '二倍标准差',
xAxis: this.standarDevRangeOfTwo.up.toFixed(1),
lineStyle: {
opacity: (this.max < this.standarDevRangeOfTwo
.up) ? 0 : 1
},
label: {
show: !(this.max < this.standarDevRangeOfTwo.up)
}
}, {
name: '三倍标准差',
xAxis: this.standarDevRangeOfThree.low.toFixed(1),
lineStyle: {
opacity: (this.min > this.standarDevRangeOfThree
.low) ? 0 : 1
},
label: {
show: !(this.min > this.standarDevRangeOfThree.low)
}
}, {
name: '三倍标准差',
xAxis: this.standarDevRangeOfThree.up.toFixed(1),
lineStyle: {
opacity: (this.max < this.standarDevRangeOfThree
.up) ? 0 : 1
},
label: {
show: !(this.max < this.standarDevRangeOfThree.up)
}
}, {
name: '平均值',
// type: 'average',
xAxis: this.average.toFixed(1),
lineStyle: {
color: 'red'
}
}, ]
}
}],
}
chart.setOption(options)
window.addEventListener("resize", () => {
chart.resize()
})
},
}
})
var app2 = new Vue({
el: '#app2',
data: {
// 首页正态曲线的计算公式
mathJax: '`f(x) = (1 / (\sqrt {2\pi} \sigma)) e^(-(x-\mu)^2/(2\sigma^2))`',
// 数据源(从隔壁的 js 文件中引入)
json: {
"R1": [], "R2": [], "R3": []
},
// 页面中输入的数据。初始默认为 json 文件
input: '', // 数组的 watch 监听不太方便处理
// 是否为样本数据
isSample: true,
datares: "",
},
watch: {
// 监听输入框,即时更新图形
input: function (val) {
this.input = val;
this.loadChartsSeried() // 加载数据
this.initChartsData('chart') // 生成 Echarts 图
},
},
computed: {
/**
* @Description: 获取数据源
w
* @Date: 2020-11-27 14:56:w
* */
data: {
get() {
// 因为数组的监听不太好处理,所以多转换一次
return this.input.split(',').map(t => parseFloat(t))
},
set(v) {
// 如果给 data 赋值,只能是数组类型
if (!(v instanceof Array)) return
// 同步更新 input 的值
this.input = v.join(',')
}
},
/**
* @Description: 有序数据源(方便操作)
* @Date: 2020-11-28 14:17:24
* */
dataOrderBy() {
const data = this.data.concat([]); // 为防止 sort 方法修改原数组,对原数组进行拷贝,操作副本。
return data.sort((a, b) => a - b)
},
/**
* @Description: 数据整理。原数据整理为:{数据值 : 数据频率}
* @Date: 2020-11-28 13:59:12
* */
dataAfterClean() {
let res = {}
for (var i = 0; i < 11; i++) {
//分成11份
var res1 = this.min + (this.AveragemarksRang * i);
res1 = String(res1);
if (res1.indexOf(".") != -1) {
//有小数点就截取小数点后两位
res1 = res1.substring(0, res1.indexOf(".") + 3);
} else {
//没有小数点就添加两位
res1 = res1+".00"
}
if (res1.length != 5) {
//判断长度是否符合柱形图的小数点后两位
res1 = res1+"0"
}
res[res1] = 0;
}
var reskey = Object.keys(res);
for (var i = 0; i < this.data.length; i++) {
for (var tmp in res) {
let key = parseFloat(this.data[i]) // 这里保留 1 位小数
if (key !== "NaN" && parseFloat(key) === 0) {
key = "0.0" //这个判断用来处理保留小数位后 -0.0 和 0.0 判定为不同 key 的 bug
}
if (key <= tmp) {
res[tmp] += 1;
break;
}
}
}
for (var i = 0; i < res.length; i++) {
}
this.datares = res;
return res
},
/**
* @Description: 数据整理。返回源数据所有值(排序后)
* @Date: 2020-11-28 14:35:52
* */
dataAfterCleanX() {
return Object.keys(this.dataAfterClean).sort((a, b) => a - b).map(t => parseFloat(t)
.toFixed(2)) // 保留 1 位小数
// return Object.keys(this.dataAfterClean) // 不保证顺序一致
},
/**
* @Description: 数据整理。返回源数据所有值对应的频率(排序后) -- 与 dataAfterCleanX 顺序一致
* @Date: 2020-11-28 13:59:12
* */
dataAfterCleanY() {
let r = []
for (let i = 0; i < this.dataAfterCleanX.length; i++) {
r.push(this.dataAfterClean[this.dataAfterCleanX[i]])
}
return r
},
/**
* @Description: 数据整理。返回源数据所有值对应的频率,刻度更细致(保留 2 位小数) -- 与 dataAfterCleanX 顺序一致
* @Date: 2020-11-29 13:59:22
* */
dataAfterCleanXSub() {
let r = []
for (let i = parseFloat(this.min.toFixed(1)); i <= parseFloat(this.max.toFixed(1)); i +=
0.01)
r.push(i.toFixed(2))
//console.log(r)
return r
},
/**
* @Description: 计算平均数。这里的平均数指的是数学期望、算术平均数
* @Date: 2020-11-27 15:24:14
* */
sum() {
if (this.data.length === 0) return 0
return this.data.reduce((prev, curr) => prev + curr)
},
/**
* @Description: 计算平均数。这里的平均数指的是数学期望、算术平均数
* @Date: 2020-11-27 15:26:03
* */
average() {
return this.sum / this.data.length
},
/**
* @Description: 计算众数
* @Date: 2020-11-27 15:26:03
* */
mode() {
return 0
},
/**
* @Description: 计算中位数
* @Date: 2020-11-27 15:26:03
* */
median() {
const data = this.dataOrderBy
return (data[(data.length - 1) >> 1] + data[data.length >> 1]) / 2
},
/**
* @Description: 计算偏差
* @Date: 2020-11-27 15:26:03
* */
deviation() {
// 1、求平均数
const avg = this.average
// 2、返回偏差。 f(x) = x - avg
return this.data.map(x => x - avg)
},
/**
* @Description: 计算总体/样本方差
* @Date: 2020-11-27 15:26:03
* */
variance() {
if (this.data.length === 0) return 0
// 1、求偏差
const dev = this.deviation
// 2、求偏差平方和
const sumOfSquOfDev = dev.map(x => x * x).reduce((x, y) => x + y)
// 3、返回方差
return sumOfSquOfDev / (this.isSample ? (this.data.length - 1) : this.data.length)
},
/**
* @Description: 计算总体/样本标准差
* @Date: 2020-11-27 15:26:03
* */
standardDeviation() {
return Math.sqrt(this.variance)
},
/**
* @Description: 计算一倍标准差范围
* @Date: 2020-11-27 15:26:03
* */
standarDevRangeOfOne() {
return {
low: this.average - 1 * this.standardDeviation,
up: this.average + 1 * this.standardDeviation
}
},
/**
* @Description: 计算三倍标准差范围
* @Date: 2020-11-27 15:29:43
* */
standarDevRangeOfTwo() {
return {
low: this.average - 2 * this.standardDeviation,
up: this.average + 2 * this.standardDeviation
}
},
/**
* @Description: 计算三倍标准差范围
* @Date: 2020-11-27 15:30:49
* */
standarDevRangeOfThree() {
return {
low: this.average - 3 * this.standardDeviation,
up: this.average + 3 * this.standardDeviation
}
},
/**
* @Description: 计算最小值
* @Date: 2020-11-28 13:19:06
* */
min() {
return Math.min.apply(null, this.data)
},
/**
* @Description: 计算最大值
* @Date: 2020-11-28 13:21:16
* */
max() {
return Math.max.apply(null, this.data)
},
/**
* @Description: 正态分布(高斯分布)计算公式
* @Date: 2020-11-28 13:46:18
* */
normalDistribution() {
// 计算公式: `f(x) = (1 / (\sqrt {2\pi} \sigma)) e^(-(x-\mu)^2/(2\sigma^2))`
// return (1 / Math.sqrt(2 * Math.PI) * a) * (Math.exp(-1 * ((x - u) * (x - u)) / (2 * a * a)))
let res = []
for (let i = 0; i < this.dataAfterCleanX.length; i++) {
const x = this.dataAfterCleanX[i]
const a = this.standardDeviation
const u = this.average
const y = (1 / (Math.sqrt(2 * Math.PI) * a)) * (Math.exp(-1 * ((x - u) * (x - u)) / (2 *
a * a)))
res.push(y)
}
return res
},
AveragemarksRang() {
return (this.max - this.min) / 11;
},
},
created() { },
mounted() {
this.data = arr1;
this.loadChartsSeried() // 加载数据
this.initChartsData('chart') // 生成 Echarts 图
},
methods: {
numFilter(value) {
const realVal = parseFloat(value).toFixed(2);
return realVal;
},
/**
* @Description: 加载 Echarts 图所需数据
*
* @Params url
*
* @return
* @Date: 2020-11-27 13:24:26
* */
loadChartsSeried() {
this.json = this.json
},
/**
* @Description: 生成 Echarts 图
*
* @Params ref:容器
*
* @return
* @Date: 2020-11-27 13:23:26
* */
initChartsData(ref) {
let chart = this.$refs[ref]
if (!chart) return
chart = echarts.init(chart)
// Echarts 图的配置
let options = {
// Echarts 图 -- 标题
title: {
//text: 'Echarts 绘制正态分布曲线(有 3 组示例数据,刷新随机显示)'
},
// Echarts 图 -- 工具
tooltip: {},
// Echarts 图 -- 图例
legend: {
data: ['f(x)']
},
// Echarts 图 -- x 坐标轴刻度 -- 正态分布数值
xAxis: [{
// name : "标准刻度(0.1)",
data: this.dataAfterCleanX,
// min: this.min,
// max: this.max
}],
// Echarts 图 -- y 坐标轴刻度
yAxis: [{
type: 'value',
//name: '频数',
position: 'left',
// 网格线
splitLine: {
show: false
},
axisLine: {
lineStyle: {
color: 'orange'
}
},
axisLabel: {
formatter: '{value}'
}
},
{
type: 'value',
//name: '概率',
position: 'right',
// 网格线
splitLine: {
show: false
},
axisLine: {
lineStyle: {
color: 'black'
}
},
axisLabel: {
formatter: '{value}'
}
},
],
// Echarts 图 -- y 轴数据
series: [{
name: '源数据', // y 轴名称
type: 'bar', // y 轴类型
yAxisIndex: 0,
barGap: 0,
barWidth: 27,
itemStyle: {
normal: {
show: true,
color: '#1ab394', //柱子颜色
borderColor: '#FF7F50' //边框颜色
}
},
data: this.dataAfterCleanY, // y 轴数据 -- 源数据
}, {
name: '正态分布', // y 轴名称
type: 'line', // y 轴类型
symbol: 'none', //去掉折线图中的节点
smooth: true, //true 为平滑曲线
yAxisIndex: 1,
//data: this.normalDistribution, // y 轴数据 -- 正态分布
// 警示线
//markLine: {
// symbol: ['none'], // 箭头方向
// lineStyle: {
// type: "silent",
// color: "green",
// },
// itemStyle: {
// normal: {
// show: true,
// color: 'black'
// }
// },
// label: {
// show: true,
// position: "middle"
// },
// data: [{
// name: '一倍标准差',
// xAxis: this.standarDevRangeOfOne.low.toFixed(1),
// // 当 n 倍标准差在坐标轴外时,将其隐藏,否则它会默认显示在最小值部分,容易引起混淆
// lineStyle: {
// opacity: (this.min > this.standarDevRangeOfOne
// .low) ? 0 : 1
// },
// label: {
// show: !(this.min > this.standarDevRangeOfOne.low)
// }
// }, {
// name: '一倍标准差',
// xAxis: this.standarDevRangeOfOne.up.toFixed(1),
// lineStyle: {
// opacity: (this.max < this.standarDevRangeOfOne.up) ?
// 0 : 1
// },
// label: {
// show: !(this.max < this.standarDevRangeOfOne.up)
// }
// }, {
// name: '二倍标准差',
// xAxis: this.standarDevRangeOfTwo.low.toFixed(1),
// lineStyle: {
// opacity: (this.min > this.standarDevRangeOfTwo
// .low) ? 0 : 1
// },
// label: {
// show: !(this.min > this.standarDevRangeOfTwo.low)
// }
// }, {
// name: '二倍标准差',
// xAxis: this.standarDevRangeOfTwo.up.toFixed(1),
// lineStyle: {
// opacity: (this.max < this.standarDevRangeOfTwo
// .up) ? 0 : 1
// },
// label: {
// show: !(this.max < this.standarDevRangeOfTwo.up)
// }
// }, {
// name: '三倍标准差',
// xAxis: this.standarDevRangeOfThree.low.toFixed(1),
// lineStyle: {
// opacity: (this.min > this.standarDevRangeOfThree
// .low) ? 0 : 1
// },
// label: {
// show: !(this.min > this.standarDevRangeOfThree.low)
// }
// }, {
// name: '三倍标准差',
// xAxis: this.standarDevRangeOfThree.up.toFixed(1),
// lineStyle: {
// opacity: (this.max < this.standarDevRangeOfThree
// .up) ? 0 : 1
// },
// label: {
// show: !(this.max < this.standarDevRangeOfThree.up)
// }
// }, {
// name: '平均值',
// // type: 'average',
// xAxis: this.average.toFixed(1),
// lineStyle: {
// color: 'red'
// }
// },]
//}
}],
}
chart.setOption(options)
window.addEventListener("resize", () => {
chart.resize()
})
},
}
})