highcharts以其强大的功能，美观的界面，吸引了众多程序员的使用。highcharts的功能也在不断的完善中。highcharts插件官网：http://www.highcharts.com/。demo网址：http://www.highcharts.com/demo/。参考手册网址：http://api.highcharts.com/highcharts。

这个javascript图标控件的使用需要两个js类库，一个是highcharts.js，另一个是exporting.js

现将一些基本功能的使用列出如下：

 

chart ：
renderTo                   图表的页面显示容器
defaultSeriesType      图表的显示类型（line,spline, scatter, splinearea bar,pie,area,column）
margin                       上下左右空隙
events                        事件
         click                function(e) {}
         load                function(e) {}
xAxis ： yAxis:
 属性：
     gridLineColor           网格颜色
reversed                     是否反向 true ,false
gridLineWidth                 网格粗细
startOnTick                是否从坐标线开始画图区域
endOnTick               是否从坐标线结束画图区域
     tickmarkPlacement          坐标值与坐标线标记的对齐方式on,between
tickPosition                 坐标线标记的样式 向内延伸还是向外延伸(insidel,outside)
tickPixelInterval              决定着横坐标的密度
tickColor                     坐标线标记的颜色
tickWidth                       坐标线标记的宽度
     lineColor               基线颜色
lineWidth                       基线宽度
max                           固定坐标最大值
min                             固定坐标最小值
plotlines                      标线属性
maxZoom
minorGridLineColor
minorGridLineWidth
/minorTickColor
title：                   
     enabled：          是否显示
     text：               坐标名称
Labels            坐标轴值显示类 默认： defaultLabelOptions
    formatter      格式化函数
   enabled             是否显示坐标轴的坐标值 
       rotation           倾斜角度
     align                 与坐标线的水平相对位置
     x                      水平偏移量
     y                      垂直偏移量
     style               
              font     字体样式 默认defaultFont
              color       颜色
    
Tooltip        数据点的提示框
   enabled                  鼠标经过时是否可动态呈现true,false
     formatter                  格式化提示框的内容样式
 
plotOptions   画各种图表的数据点的设置
    defaultOptions        默认设置
属性
    Area 类 :
lineWidth                   线宽度
fillColor                 area的填充颜色组
marker{}                设置动态属性
shadow                  是否阴影 true,false
states                        设置状态？
   Line 类
          dataLabels:        数据显示类
              enabled           是否直接显示点的数据true,false
series
  name                   该条曲线名称
  data[]                     该条曲线的数据项
addPoint([x,y],redraw,cover) 添加描点，redraw 是否重画，cover是否左移
setData: function(data, redraw) 重新设置Data数组，redraw是否重画
remove: function(redraw)         删除曲线
redraw: function()                     重画曲线
marker ：
enabled                  是否显示描点
 
。。。。。。
dateFormat(options.dateTimeLabelFormats[unit[0]], this.value, 1)
 
 
选择对象
 
var chart = new Highcharts.Chart({
  • chart
　　　　 alignTicks　　　　:true　　Boolean　　多个y轴时对他们公共轴心的选取，ture为自动选取较适宜的公共轴心
　　　　 animation　　　　:true　　BooleanObject　　动画更新效果
　　　　 backgroundColor　　　　:Color　　绘图区背景色
　　　　 borderColor　　　　:Color　　绘图边框颜色　
　　　　 borderRadius　　　　:Number　　绘图边角的弧度设置
　　　　 borderWidth　　　　:Number　　　　边框宽度设置
　　　　 className　　　　:String　　　　确定绘图区容器的类区范围
　　　　 defaultSeriesType　　　　:Sting　　默认绘图类型的设置
　　　　 events　　　　:chart.events　　绘图触发事件
　　　　　　 addSeries　　　　:Function　　添加series数据
　　　　　　 click　　　　：Function　　单击事件
　　　　　　 load　　　　:Function　　加载事件
　　　　　　 redraw　　　　：Function　　重画事件
　　　　　　 selection　　　　:Function　　选着区域事件
　　　　 height　　　　:Number　　高度
　　　　 ignoreHiddenSeries　　　　:True　　Boolean　　多个数据时，隐藏一个数据是否更改轴心，true为可更改，false为不可更改
　　　　 inverted　　　　:False　　Boolean　　　数轴的转换
　　　　 margin　　　　:Numberr　　内边距设置
　　　　 marginTop
　　　　 marginBottom
　　　　 marginRight
　　　　 marginLeft
　　　　 plotBackgroundColor　　　　:Color　　部分颜色的变化
　　　　 plotBackgroundImage　　　　:String　　加载图片
　　　　 plotBorderColor
　　　　 plotBorderWidth
　　　　 plotBorderShadow
　　　　 reflow　　　　:True　　　　:Boolean　　是否跟谁容器大小改变
　　　　 renderTo　　　　:String　　引用容器
　　　　 resetZoonButton　　　　区域选择与重置图片与event事件中的selection事件相似
　　　　 selectionMarkerFill　　　　悬着区域的颜色
　　　　 shadow　　　　阴影
　　　　 showAxes　　　　加载前轴的显示
　　　　 spacingTop　　外边距　　：Number
　　　　 spacingBottom
　　　　 spacingLeft
　　　　 style　　　　：CSSObject
　　　　 type　　　　绘图类型 默认：line
　　　　 width　　　　绘图宽度的设置
　　　　 zoomType　　　　区域选择范围 可与event.selection和resetZoomButton参考，他们是区域选择的功能接口
  • colors
colors: [
        '#4572A7',
        '#AA4643',
        '#89A54E',
        '#80699B',
        '#3D96AE',
        '#DB843D',
        '#92A8CD',
        '#A47D7C',
        '#B5CA92'
]
  • credits　　　　右下角的名片说明
　　　　 enabled　　　　:Boolean　　默认值：True　　是否显示名片
　　　　 position　　　　:Object　　位置的确定
　　　　 href　　　　　　:String　　名片连接地址 默认值：www.highcharts.com
　　　　 style　　　　　　:CSSObject　　名片CSS模式
　　　　 text　　　　　　:String　　名片显示名字　　默认值：highcharts.com
  • global　　Highcharts.SetOptions方法调用
　　　　 canvasToolsURL　　　　:String　　　　画布工具连接，例如：Andrio的 2.0不支持SVG
　　　　 useUTC　　　　:Boolean　　UTC time　　　　http://jsfiddle.net/X3jPh/
  • labels　　HTML标签，可以放置在绘图的任何位置
　　　　 item　　:Array
　　　　　　 html　　:String
　　　　　　 style　　:CSSObject
　　　　 style　　　　：CSSObject
  • lang
　　　　 decimalPoint　　　　:String　　　　小数点 默认值"."
　　　　 downloadPNG　　　　:String　　　　导出图片PNG  默认值："Download PNG p_w_picpath".
　　　　 downloadJPEG　　　　:String 　　　导出图片JPEG  默认值： "Download JPEG p_w_picpath"
　　　　 downloadPDF
　　　　 downloadSVG
　　　　 exportButtonTitle　　:String　　　　导出图片按钮　　默认值： "Export to raster or vector p_w_picpath".
　　　　 loading　　　:String　　　　加载显示 默认值： Loading....
　　　　 months　　　　:Array<String>　　　　月的数组  Highcharts.dateFormat()  默认值：['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'].
　　　　 shortMonths　　上边月的缩写数组
　　　　 printButtonTitle　　:String 　　　　打印按钮　　默认值： "Print the chart".
　　　　 resetZoom　　　　:String　　　　重置焦距 默认值： Reset zoom.
　　　　 resetZoomTitle　　　　:String　　　　重置焦距设置 默认值： Reset zoom level 1:1.
　　　　 thousandsSep　　　　:String　　　　前分为 默认值：",".例如：1，000,000
　　　　 weekdays　　　　:Array<String>　　　星期数组　　默认值： ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'].
  • legend
  • loading
  • plotOptions
  • point
  • series
  • subtitle
  • symbols
  • title
  • tooltip
  • xAxis
  • yAxis
  • exporting
  • navigation
});