Highcharts入门之基本属性

 更新时间:2016年08月02日 17:12:54   投稿:daisy  
Highcharts是一个用纯JavaScript编写的一个图表库,之前小编发了一篇介绍Highcharts的文章,那么本文将进一步的介绍Highcharts的基本属性,有需要的可以参考学习。

一.基本组成:

    1.Highcharts包含标题(Title):主标题是必须的但是subTTitle不是必须

    2.坐标轴(Axis):有x坐标(xAxis)和y坐标(yAxis)

    3.数据列(Series):每个曲线,每个柱形条组,每个饼图的部分

    4.数据提示框(Tooltip):鼠标放上去的提示框

    5.图例(Legend):通过点击标示可以显示或隐藏该数据列

    6.<!--more-->

    7.版权信息(Credits):一般是highcharts的官网,指定credits.enabled=false不让显示

    8.导出功能按钮(Exporting):需要包含exporting.js

    9.标示线(PlotLines):主动添加如平均线等

二.参数属性:

1、调用highcharts:

方法一:

$(function () {
    $(".chart").highcharts({});
});

方法二:

var charts = new Highcharts.Chart({
  // Highcharts 配置
  chart : {
    renderTo : "container" // 注意这里一定是 ID 选择器
  }
}); 

2、设置表格宽高:

等同于设置div的宽高:

style="width: 800px ;height: 400px"

3、图表样式:

常见的有:borderbackgroundColormarginspacingstyle

总结

以上就是Highcharts入门之基本属性的全部内容,希望对大家学习Highcharts有所帮助,小编还会陆续更新Highcharts的相关文章,请继续关注脚本之家。

相关文章

  • js类库styled-components快速入门教程

    js类库styled-components快速入门教程

    这篇文章主要为大家介绍了js类库styled-components快速入门的教程示例,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-06-06
  • Three.js学习之正交投影照相机

    Three.js学习之正交投影照相机

    本篇主要介绍照相机中的正交投影照相机。学习Three.js的小伙伴们可以参考学习。
    2016-08-08
  • fullCalendar中文API官方文档

    fullCalendar中文API官方文档

    FullCalendar是一款基于jQuery的日历插件,适用于各种日程安排、工作计划等场景,本文是fullCalendar官方文档的中文版,主要介绍了fullCalendar的具体属性与方法,大家可以参考一下
    2017-02-02
  • 浅谈轻量级js模板引擎simplite

    浅谈轻量级js模板引擎simplite

    这篇文章主要介绍了浅谈轻量级js模板引擎simplite的简介和用法的相关资料,需要的朋友可以参考下
    2015-02-02
  • JS日程管理插件FullCalendar中文说明文档

    JS日程管理插件FullCalendar中文说明文档

    JS日程管理插件FullCalendar提供了丰富的属性设置和方法调用,开发者可以根据FullCalendar提供的API快速完成一个日历日程的开发,本文将FullCalendar的常用属性和方法、回调函数等整理成中文文档,以供参阅。
    2017-02-02
  • 交互式可视化js库gojs使用介绍及技巧

    交互式可视化js库gojs使用介绍及技巧

    这篇文章主要介绍了如何使用可视化库gojs及使用时的小技巧,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2022-01-01
  • JS日程管理插件FullCalendar简单实例

    JS日程管理插件FullCalendar简单实例

    JS日程管理插件FullCalendar是一款基于jQuery的日历日程插件,适用于各种日程安排、工作计划等场景,您可以很方便的查看查看待办事项,标记重要事项以及绑定点击和拖动事件,能快速的整合到您的项目中,本文将简单介绍FullCalendar的使用
    2017-02-02
  • 使用RequireJS库加载JavaScript模块的实例教程

    使用RequireJS库加载JavaScript模块的实例教程

    RequireJS库的主旨就是一个js文件的模块加载器,可以独立于框架来进行使用,这里我们整理了使用RequireJS库加载JavaScript模块的实例教程,需要的朋友可以参考下
    2016-06-06
  • Three.js学习之Lamber材质和Phong材质

    Three.js学习之Lamber材质和Phong材质

    本篇将介绍基本材质以及两种基于光照模型的材质(Lamber与Phong),有需要的小伙伴们可以参考学习。
    2016-08-08
  • ThinkJS中如何使用MongoDB的CURD操作

    ThinkJS中如何使用MongoDB的CURD操作

    最近因为心血来潮想要试试thinkJS操作mongoDB,去官方文档看了看,默认是只给了mysql的配置,源代码也是没有配置mongo的,只有一个官方案例,无奈只能自己学习了,下面是自己的一些学习总结,有需要的朋友们可以参考借鉴,下面来一起看看吧。
    2016-12-12

最新评论