参考
多坐标轴混合图 | JShare
使用 js资源
https://cdn.highcharts.com.cn/10.2.1/highcharts.js
https://cdn.highcharts.com.cn/10.2.1/modules/exporting.js
https://img.hcharts.cn/highcharts-plugins/highcharts-zh_CN.js

效果

js 引用
<script src="https://cdn.highcharts.com.cn/10.1.0/modules/exporting.js"></script> <script src="../static/js/echarts.min.js" th:src="@{/js/highcharjs/highcharts-10.1.0.js}"></script> <script src="../static/js/echarts.min.js" th:src="@{/js/highcharjs/highcharts-zh_CN.js}"></script><script src="../static/js/jquery.min.js" th:src="@{/js/jquery.min.js}"></script>
html
<div class="col-sm-12 select-table table-striped"> <div id="container" style="width: 100%;height:400px;"></div> </div>
js
x是x轴数据[2022-01-01 07:00:00,X,X,X)]
series 是y轴数组[
[10,9,91,7.8],
[10,9,91,7.8]
]
function char(x,series) {
var chart = Highcharts.chart('container', {
chart: {
zoomType: 'xyy'
},
title: {
text: '铁水分包重量曲线'
},
subtitle: {
text: ''
},
xAxis: [{
categories: x,
// '1:00','2:00','3:00','4:00','5:00','6:00','7:00', '8:00', '9:00', '10:00', '11:00', '12:00','13:00', '14:00', '15:00', '16:00',
crosshair: true
}],
plotOptions: {
series: {
stacking: 'normal'
}
},
yAxis: [ { // Secondary yAxis
gridLineWidth: 0,
title: {
text: '实际出铁吨位',
style: {
color: Highcharts.getOptions().colors[0]
}
},
labels: {
format: '{value} 吨',
style: {
color: Highcharts.getOptions().colors[0]
}
}
}],
tooltip: {
shared: true
},
legend: {
layout: 'horizontal',
align: 'left',
x: 76,
verticalAlign: 'top',
y: 16,
floating: true,
backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'
},
series: series
});
}


![[附源码]java毕业设计校园飞毛腿系统](https://img-blog.csdnimg.cn/0a4d5bde10cc4b3c90800691bd375d82.png)

![[附源码]计算机毕业设计JAVA基于web的球类体育馆预定系统](https://img-blog.csdnimg.cn/7799420366594499855e6579801a7aea.png)














