项目做了一个报表，可以实时的观察呼叫中心的电话访问量，之前的版本是使用JFreechart做的，使用一段时间后出现内存溢出，服务器的内存使用量会变得很大，所以改用Ajax前台加载数据的方式实现实时报表功能，查了很久选择了JQuery结合Highcharts的方式，Highcharts是一个JS实时报表API，下面给出基本代码：
首先，要添加JQuery和Highcharts的引用：
Js代码 收藏代码
<script type='text/javascript' src='js/jquery-132js'></script>
<script type='text/javascript' src='js/highchartsjs'></script>
页面的body部分需要有个层用来渲染图表：
Java代码 收藏代码
<body>
<div id="container" style="height: 400px"></div>
</body>
在JS中声明图表：
Js代码 收藏代码
<script type='text/javascript'>
//<![CDATA[
$(function(){
//声明报表对象
var chart = new HighchartsChart({
chart: {
//将报表对象渲染到层上
renderTo: 'container'
},
//设定报表对象的初始数据
series: [{
data: [299, 715, 1064, 1292, 1440, 1760, 1356, 1485, 2164, 1941, 956, 544]
}]
});
function getForm(){
//使用JQuery从后台获取JSON格式的数据
jQuerygetJSON('>
我想请问下你是不会java的代码还是不会highcharts的代码哦？highcharts不是提供了很多例子吗？你只需要用java将从数据库查询到的数据转换成json格式传到前台就可以展示效果了啊。
这个要依赖本地的实际环境，谁有那么多时间给你写啊，而且不是一两句代码的事情。你可以自己尝试去写，不会的地方可以问我。
希望可以帮助到你，望采纳，谢谢，有问题可以继续追问我
第一步，新建静态页面linehtml，引入HighCharts核心js文件
第二步，插入折线图容器，设置折线图宽度和高度
第三步，编写生成HighCharts折线图的js代码
第四步，预览该静态页面，查看折线图效果
第五步，添加如下代码
line:{dataLabels:{
enabled:true
}
}
第六步，再次预览该界面，可以看到图形上点数据显示出来了
以上就是关于highcharts从后台获得json数据怎么在页面展示全部的内容，包括:highcharts从后台获得json数据怎么在页面展示、【数据可视化】Highcharts 时区问题总结、HIghcharts实现从Mysql实时读取数据库（Java的）等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）