highcharts插件使用总结和开发中遇到的问题及解决办法.doc

开发过程遇到的问题：
1)  Js的引入顺序错了，导致highchart的图表出不来，
Highchart插件中用到了jquery，当时jquery-1.8.3.js的引入顺序放到了highchart插件js的下面，
导致当加载highchart插件用到的js时，找不到jquery的js，报出某个js的函数不合法
因此 jquery的js要在引入highchart的js之前引入
2)  exporting.js 打印下载的js中，提示的都是英文，

要显示中文，这里采用的方法是修改exporting.js
p(s.lang,{printChart:"打印报表",downloadPNG:"下载为PNG格式图片",downloadJPEG:"下载为JPEG格式图片",
downloadPDF:"下载为PDF格式文档",downloadSVG:"下载为SVG格式矢量图片",contextButtonTitle:"打印 下载"});
修改后的效果：

当修改了exporting.js后，当保存时，没法保存js，提示编码问题
解决方法是：
window>>preferences>>general>>content types 
在右边的窗口中打开列表,选中"JavaScript"，在下面的"default encoding"右边的输入框中输入"utf-8"，再点"update"按钮

单击打印下载时，显示的下拉框在大部分的ie浏览器中显示的很难看，火狐下正常

原因: 上面的下拉框显示很长，是由于hr标签的原因，导致hr的宽度按照 100%进行了显示
解决方法：
在显示highchart图标的jsp页面中，添加hr的样式

   hr{height: 0;margin: 0;padding: 0;width: 0;}

第二步：组装添加显示highchart图表所用的数据
 View Code
基本的highchart显示的数据格式是:
X轴数据信息

图例和显示数据的格式：

因此我们要做的就是根据需求，在java后台组装好上面的数据，填充到highchart的js代码中即可
导出的Java后台代码    (使用的是struts1)没有在struts的配置文件中配置,直接是在jsp中url请求
struts1版的结合highchart导出图片的java代码
使用highchart调用本地的java类导出图片时，用到的jar包
batik-all-1.6.jar  fop.jar     xerces-2.9.0.jar
 View Code
使用highchart生成报表信息的部分后台java代码
开发中遇到的问题
1 在开发中使用了webservice，在dao层的java代码中使用了Map，但是Map在webservice中并不支持，
2. 解决方法就是，在dao层的java代码中把Map中的数据使用json-lib插件转换成了Json
3. 然后在action层中再使用json-lib插件转换成Map
java代码片段
 View Code

 View Code

 View Code

 View Code
highcharts效果图

附上jsp的代码
 View Code
欢迎转载，转载务必请注明出处，谢谢。
分类: java
好文要顶 关注我 收藏该文  

wanggd_blog
关注 - 7
粉丝 - 15
+加关注
0
0
(请您对文章做出评价)
« 上一篇：Oracle中group by用法
posted @ 2014-01-22 15:10 wanggd_blog 阅读(6964) 评论(4) 编辑 收藏
评论列表

#1楼 2014-07-17 11:22 伊牛娃  

headerFormat:'监测时间：{point.key}',//鼠标停留提示 这个json格式的时间怎么转换成正常显示的时间，求指点啊
支持(0)反对(0)

#2楼 2014-07-31 09:52 xuweiforever  
你好，我想请教一个问题，横轴 怎么才能显示 年月日时分秒 这种格式呢？先谢过了，弄了一两天没搞明白，还得麻烦你帮我讲解一下哦
支持(0)反对(0)

#3楼 2014-09-24 11:58 11点后要睡觉  
mark
支持(0)反对(0)

#4楼 2014-12-22 16:17 打伞的鱼  
楼主，参考你的代码导出图片时报一下错误，楼主知道怎么修复吗？跪谢！

1
2
3
4
5
6
7
8
9
10
11
ERROR: null
Enclosed Exception:
:
The attribute "fill" represents an invalid CSS value ("rgba(99,156,211,1)").
Original message:
The "fill" property does not support function values.
org.w3c.dom.DOMException: :
The attribute "fill" represents an invalid CSS value ("rgba(249, 249, 249, 85)").
Original message:
The "fill" property does not support function values.
    at org.apache.batik.css.engine.CSSEngine.getCascadedStyleMap(Unknown Source)
支持(0)反对(0)
刷新评论刷新页面返回顶部
注册用户登录后才能发表评论，请 登录 或 注册，访问网站首页。
【推荐】50万行VC++源码: 大型组态工控、电力仿真CAD与GIS源码库
【推荐】融云即时通讯云－专注为 App 开发者提供IM云服务
【福利】极光推送-富媒体+大数据驱动精准推送，完全免费开放啦
【专享】阿里云9折优惠码：bky758