<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ECharts</title>
<!-- 引入 echarts.js -->
<script src="js/echarts.min.js"></script>
</head>
<body>
<!-- 为ECharts准备一个具备大小(宽高)的Dom -->
<div id="main" style="width: 400px;height:460px;"></div>
<script type="text/javascript">
// 基于准备好的dom,初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
var TP_value = 40;
var kd = [];
var Gradient = [];
var leftColor = '';
var showValue = '';
var boxPosition = [65, 0];
var TP_txt = ''
// 刻度使用柱状图模拟,短设置1,长的设置3;构造一个数据
for(var i = 0, len = 135; i <= len; i++) {
if(i < 10 || i > 130) {
kd.push('')
} else {
if((i - 10) % 20 === 0) {
kd.push('-3');
} else if((i - 10) % 4 === 0) {
kd.push('-1');
} else {
kd.push('');
}
}
}
//中间线的渐变色和文本内容
if(TP_value > 20) {
TP_txt = '温度偏高';
Gradient.push({
offset: 0,
color: '#93FE94'
}, {
offset: 0.5,
color: '#E4D225'
}, {
offset: 1,
color: '#E01F28'
})
} else if(TP_value > -20) {
TP_txt = '温度正常';
Gradient.push({
offset: 0,
color: '#93FE94'
}, {
offset: 1,
color: '#E4D225'
})