本弗莱数据可视化的生产流程图_工业化中的数据可视化大屏学习笔记（一）

------------highcharts学习日记和随笔------------

1.下载什么的就不说啦，大家有需要的可以去官网下载：https://www.highcharts.com.cn/docs

2.个人学习和使用时用的构造函数，其他方法有chart.rederTo来定和在引入jQuery后用$("id的定义名").highcharts({})；来定义

3.个人在使用中出现的一个错误，所有的数据都可以获取但是在HTML页面中无法显示图表，个人在这里说一下，是因为jQuery文件和highcharts文件放置顺序的问题，改正为先放jquery，再放heighchaert；

4.基本图表只需要引用jquery.min.js和heighchaert.js就可以

5.(引入jQuery文件后)图表定义中 var chart={ type：line(默认直线)spline(曲线)pie(饼图)column(柱状)这是基本图表}

临时补充：在图表的表土中不需要的可以将text:"标题"//设置为null，也可以自定义修改

6.在其图表右下角有一个官网签名取消为 var credits={enabled：false//禁用，true//启用}

7.主副标题(title，subtitle)

8.x.y轴信息：xAxis和yAxis

9.图表数据：series(name data)

10.数据格式官网推荐使用json数据格式，其他数据格式请大家自己研究

11.下面是一个简单的图片，默认为横向柱状图：

第一个 Highcharts 图表

var options = {

chart: {

type: 'bar' //指定图表的类型，默认是折线图(line)

},

title: {

text: '我的第一个图表' // 标题

},

xAxis: {

categories: ['苹果', '香蕉', '橙子'] // x 轴分类

},

yAxis: {

title: {

text: '吃水果个数' // y 轴标题

}

},

series: [{ // 数据列

name: '小明', // 数据列名

data: [1, 0, 4] // 数据

}, {

name: '小红',

data: [5, 7, 3]

}]

};

// 图表初始化函数

var chart = Highcharts.chart('container', options);

复制即可使用

12.其实highcharts数据可视化中大多数为函数，可以多看看官网，学习一下函数的使用，

13.不喜勿喷，谢谢