最开始用Highcharts是客户要求我们对统计结果进行可视化，而Highcharts支持直线图、曲线图、面积图、柱状图、饼图、散点图等多达十几种不同类型的图表，样式也较为美观，可与excel里面的图标样式相媲美。
part1 入门
Highcharts入门很简单，参考教程就可以根据自己的需求做出想要的效果了。
参考网址Highcharts中文网：http://www.hcharts.cn/index.php。其中在线演示可以查看源码，另外还有文档教程API文档进行细节的学习。
首先了解下Highcharts的基本组成：
（图片来自Highcharts中文网）
先了解各个部分的名称，检索各部分的设置方法的时候也清楚些。比如想知道图例可以放在上边的时候怎么设置，就可以检索“legend”，找到跟图例相关的设置：
part2 遇到的显示问题及解决方法
折线图、饼图、柱状图是我工作中使用的比较多的，下面给出一些遇到的小问题和解决方法：
（1）如何去掉右下角的网址
1 credits:{
2 enabled:false // 禁用版权信息
3 }
（2）如何改变数字的分隔符、小数点、导出图片按钮由原来的英文改成中文以及没有数据的时候进行提示
1 // 全局配置
2 Highcharts.setOptions({
3 lang:{
4 contextButtonTitle:"图表导出菜单",
5 decimalPoint:".",
6 noData:"没有数据",
7 thousandsSep:","
8 }
9 });
（3）标题的显示控制
主标题不显示则设置text为null，副标题不显示直接不设置subtitle就可以
1 title: {
2 text: null
3 }
（4）横向纵向网格线显示控制
通过gridLineWidth来控制显示，0为不显示，>0显示。
xAxis的gridLineWidth默认为0，yAxis的gridLineWidth默认不为0，需要通过设置为0来控制不显示。
1 yAxis: {
2 gridLineWidth: 0
3 }
part3 ajax传参数据处理方法
对于highcharts，设置方面的细节文档几乎都可以查到方法，比较麻烦的应该是传参。对于已经固定的参数，可以直接按着例子去设置；对于后台传来的不固定的值，则要把ajax传过来的json值进行格式转换。下面举例饼图和柱状图ajax传参后如何设设置，直接给出示例代码：
（1）饼图（直接在ajax方法内设值）：
1 //异步请求数据
2 $.ajax({
3 type:"post",
4 dataType:‘json‘,
5 url:"exampleUrl",
6 success:function(data){
7 //定义一个数组
8 browsers = [],
9 //迭代，把异步获取的数据放到数组中
10 $.each(data,function(i,d){
11 browsers.push([d.name,d.percent]);
12 });
13 //设置数据
14 chart.series[0].setData(browsers);
15 },
16 error:function(e){
17 alert(e);
18 }
19 });
（2）柱状图（ajax方法内取值，方法外设置）：
1 //定义数组
2 var xname=[];
3 var onlineRate=[];
4 //异步请求数据
5 $.ajax({
6 type:‘post‘,
7 dataType:‘json‘,
8 data:query,
9 url:" exampleUrl ",
10 success:function(data){
11 //迭代，把异步获取的数据放到数组中
12 $(data).each(function(){
13 xname.push(this.name);
14 onlineRate.push(this.onlineRate);
15 });
16 }
17 });
设值：
xAxis: {
categories: xname
},
series: [{
name: ‘全省在线情况‘,
data: onlineRate,
dataLabels: {
enabled: true,
formatter: function() {
return this.point.y+"%";
}
}
}]
在ajax方法内设值或者方法外都是可以的，根据具体情况灵活处理。以上例子只截取了部分关键代码，仅供参考。
希望以上描述有帮到需要的人，有不清楚的可以留言，谢谢！