本章节我们将为大家介绍 Highcharts 的气泡图。

我们在前面的章节已经了解了 Highcharts 配置语法。接下来让我们来看下 Highcharts 的其他配置。

配置

chart 配置

配置 chart 的 type 为 'bubble' 。chart.type 描述了图表类型。默认值为 "line"。

chart.zoomType 属性可配置图表放大 ，通过拖动鼠标进行缩放，沿x轴或y轴进行缩放，可以设置为：'x','y','xy'。

var chart = { type: 'bubble', zoomType: 'xy' };

实例

文件名：highcharts_bubble_basic.htm

实例

   Highcharts 教程 | 菜鸟教程(runoob.com)

运行实例 »

点击 "运行实例" 按钮查看在线实例

3D 气泡图

series.marker

设置 series.marker 渐变让其看起来有 3D 的效果。

marker: { fillColor: { radialGradient: { cx: 0.4, cy: 0.3, r: 0.7 }, stops: [ [0, 'rgba(255,255,255,0.5)'], [1, Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0.5).get('rgba')] ] } }

实例

文件名：highcharts_bubble_3d.htm

实例

   Highcharts 教程 | 菜鸟教程(runoob.com)

运行实例 »

点击 "运行实例" 按钮查看在线实例