Learning Path
浏览 Highcharts 相关教程与章节。
HTML、CSS、JavaScript、浏览器 API、前端框架与 UI 工程。
教程
70
Highcharts 教程 Highcharts 是一个用纯JavaScript编写的一个图表库。 Highcharts 能够很简单便捷的在web网站或是web应用程序添加有交互性的图表 Highcharts 免费提供给个人学习、个人网站和非商业用途使用。 HighCharts 特性 兼容性 - 支持所有主流浏览器和移动平台(android、iOS等)。 多设备 - 支持多种设备,如手持设备 iPhone/iPad、平板等。 ..
Highcharts 3D图 本章节我们将为大家介绍 Highcharts 的3D图。 序号图表类型 13D 柱形图 2带空值的3D 柱形图 3堆叠 3D 柱形图 43D 饼图 53D 圆环图..
Highcharts 带空值(null)和0的3D柱形图 Highcharts 3D图 以下实例演示了带空值(null)和0的3D柱形图。 我们在前面的章节已经了解了 Highcharts 基本配置语法。接下来让我们来看下其他的配置。 配置 chart.options3d 配置 以下列出了 3D 图的基本配置,设置 chart 的 type 属性为 column,options3d 选项可设置三维效果。 var chart ..
Highcharts 3D柱形图 Highcharts 3D图 以下实例演示了3D柱形图。 我们在前面的章节已经了解了 Highcharts 基本配置语法。接下来让我们来看下其他的配置。 配置 chart.options3d 配置 以下列出了 3D 图的基本配置,设置 chart 的 type 属性为 column,options3d 选项可设置三维效果。 var chart = { type: 'colum..
Highcharts 3D圆环图 Highcharts 3D图 以下实例演示了3D饼图。 我们在前面的章节已经了解了 Highcharts 基本配置语法。接下来让我们来看下其他的配置。 配置 chart.options3d 配置 以下列出了 3D 图的基本配置,设置 chart 的 type 属性为 pie,options3d 选项可设置三维效果。 var chart = { type: 'pie'..
Highcharts 3D饼图 Highcharts 3D图 以下实例演示了3D饼图。 我们在前面的章节已经了解了 Highcharts 基本配置语法。接下来让我们来看下其他的配置。 配置 chart.options3d 配置 以下列出了 3D 图的基本配置,设置 chart 的 type 属性为 pie,options3d 选项可设置三维效果。 var chart = { type: 'pie',..
Highcharts 堆叠3D柱形图 Highcharts 3D图 以下实例演示了堆叠3D柱形图。 我们在前面的章节已经了解了 Highcharts 基本配置语法。接下来让我们来看下其他的配置。 配置 chart.options3d 配置 以下列出了 3D 图的基本配置,设置 chart 的 type 属性为 column,options3d 选项可设置三维效果。 var chart = { type: 'c..
Highcharts 测量图 本章节我们将为大家介绍 Highcharts 的测量图。 序号图表类型 1测量图 2圆形进度条式测量图 3时钟 4双轴车速表 5音量表(VU Meter)..
Highcharts 基本区域图 Highcharts 区域图 以下实例演示了基础区域图。 我们在前面的章节已经了解了 Highcharts 基本配置语法。接下来让我们来看下其他的配置: 配置 chart chart.type 配置项用于设定图表类型,默认为 'line',本章节我们使用 'area'。 var chart = { type: 'area' }; ..
Highcharts 区域图 本章节我们为大家介绍几种区域图类型。 序号图表类型 1基本区域图 2区域图,使用负值 3堆叠区域图,各个区域叠加 4使用百分比的区域图 5丢失数据的区域图 6反转x轴与y轴 7曲线区域图 8区间区域图 9区域区间和线..
Highcharts 反转x轴与y轴 Highcharts 区域图 以下实例演示了反转x轴与y轴区域图。 我们在前面的章节已经了解了 Highcharts 基本配置语法。接下来让我们来看下其他的配置。在 chart 中添加 inverted 属性。 chart 配置 将 chart 的 inverted 属性设置为 true,X轴为垂直,Y轴为水平的。 var chart = { type: 'area..
Highcharts 丢失值区域图 Highcharts 区域图 以下实例演示了丢失值区域图。 我们在前面的章节已经了解了 Highcharts 基本配置语法。接下来让我们来看下其他的配置。在 chart 中添加 spacingBottom 属性。 chart 配置 将 chart 的 spacingBottom 属性设置为 30。表示图表间的间隔区间。 var chart = { type: 'area�..
Highcharts 使用负数区域图 Highcharts 区域图 以下实例演示了使用负数区域图。 我们在前面的章节已经了解了 Highcharts 基本配置语法。接下来让我们来看下其他的实例: 实例 文件名:highcharts_area_negative.htm Highcharts 教程 | 菜鸟教程(runoob.com) $(document).ready(function() { var ..
Highcharts 百分比堆叠区域图 Highcharts 区域图 以下实例演示了百分比堆叠区域图。 我们在前面的章节已经了解了 Highcharts 基本配置语法。接下来让我们来看下其他的配置。在 plotOptions 中添加 stacking 属性: 配置 plotOptions:数据点选项 plotOptions用于设置图表中的数据点相关属性。plotOptions根据各种图表类型,其属性设置略微有些差异。 配置图..
Highcharts 区间区域图 Highcharts 区域图 以下实例演示了区间区域图。 我们在前面的章节已经了解了 Highcharts 基本配置语法。接下来让我们来看下其他的配置。在 chart 中修改 type 属性。 chart 配置 将 chart 的 type 属性设置为 arearange,chart.type 描述了图表类型。默认值为 'line'。 var chart = { ty..
Highcharts 使用区间和线的区域图 Highcharts 区域图 以下实例演示了使用区间和线的区域图。 我们在前面的章节已经了解了 Highcharts 基本配置语法。接下来让我们来看下其他的配置。在 chart 中修改 type 属性。 chart 配置 将 chart 的 type 属性设置为 arearange,chart.type 描述了图表类型。默认值为 'line'。 var chart..
Highcharts 曲线区域图 Highcharts 区域图 以下实例演示了曲线区域图。 我们在前面的章节已经了解了 Highcharts 基本配置语法。接下来让我们来看下其他的配置。在 chart 中修改 type 属性。 chart 配置 将 chart 的 type 属性设置为 areaspline,chart.type 描述了图表类型。默认值为 'line'。 var chart = { t..
Highcharts 堆叠区域图 Highcharts 区域图 以下实例演示了堆叠区域图。 我们在前面的章节已经了解了 Highcharts 基本配置语法。接下来让我们来看下其他的配置。在 plotOptions 中添加 stacking 属性: 配置 plotOptions:数据点选项 plotOptions用于设置图表中的数据点相关属性。plotOptions根据各种图表类型,其属性设置略微有些差异。 配置图表堆叠设置 ..
Highcharts 基本条形图 Highcharts 条形图 以下实例演示了基本条形图。 我们在前面的章节已经了解了 Highcharts 基本配置语法。接下来让我们来看下其他的配置。 配置 chart 配置 设置 chart 的 type 属性 为 bar ,chart.type 描述了图表类型。默认值为 'line'。 var chart = { type: 'bar' }; ..
Highcharts 条形图 本章节我们将为大家介绍几种条形图的类型。 序号图表类型 1基本条形图 2堆叠条形图 3反向条形图..
Highcharts 反向条形图 Highcharts 条形图 以下实例演示了使用负值的,反向条形图。 实例 文件名:highcharts_bar_negative.htm Highcharts 教程 | 菜鸟教程(runoob.com) $(document).ready(function() { var chart = { type: 'bar' }; ..
Highcharts 堆叠条形图 Highcharts 条形图 以下实例演示了堆叠条形图。 我们在前面的章节已经了解了 Highcharts 基本配置语法。接下来让我们来看下其他的配置。 配置 plotOptions 配置图表堆叠使用 plotOptions.series.stacking,并设置为 'normal'。如果禁用堆叠可设置为 null , 'normal' 通过值设置堆叠, ..
Highcharts 气泡图 本章节我们将为大家介绍 Highcharts 的气泡图。 我们在前面的章节已经了解了 Highcharts 配置语法。接下来让我们来看下 Highcharts 的其他配置。 配置 chart 配置 配置 chart 的 type 为 'bubble' 。chart.type 描述了图表类型。默认值为 'line'。 chart.zoomType 属性可配置图表放大..
Highcharts 基本柱形图 Highcharts 柱形图 以下实例演示了基本柱形图。 我们在前面的章节已经了解了 Highcharts 基本配置语法。接下来让我们来看下其他的配置。 配置 chart 配置 设置 chart 的 type 属性 为 column ,chart.type 描述了图表类型。默认值为 'line'。 var chart = { type: 'column&#..