Highcharts 气泡图.pdfVIP

Highcharts ⽓泡图 Highcharts ⽓泡图 本章节我们将为⼤家介绍 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 html head titleHighchart 教程 | W3C chool教程(w3c )/title cript rc=http://app ./lib /jquery/2.1.4/jquery .min cript rc=/try/demo_ ource/highchart .j / cript cript rc=http://code.highchart .com/highchart -more.j / /head body div id=container tyle=width: 550px; height: 400px; margin: 0 cript language=JavaScript $(document).ready(function() { var chart = { type: bubble, zoomType: xy }; var title = { text: Highchart Bubble }; var erie = [{ data: [[97, 36, 79], [94, 74, 60], [68, 76, 58], [64, }, { data: [[25, 10, 87], [2, 75, 59], [11, 54, 8], [86, 55 }, { data: [[47, 47, 21], [20, 12, 4], [6, 76, 91], [38, 30 } ]; var j on = {}; j on.chart = chart; j on.title = title; j on. erie = erie ; $(#container).highchart (j on); }); / cript /body /html 尝试⼀下 » 以上实例输出结果为： Highcharts 饼图 3D ⽓泡图 series.marker 设置 series.marker 渐变让其 起来有 3D 的效果。 marker: { fillColor: { radialGradient: { cx : 0.4, cy : 0.3, r: 0.7 }, top : [ [0, rgba(255,255,255,0.5)], [1, Highchart .Color(Highchart .getOption ().color [0]). ] } } 实例 ⽂件名：highcharts_bubble_3 .htm html head titleHighchart 教程 | W3C chool教程(w3c )/title cript rc=http://app ./lib /jquery/2.1.4/jquery .min cript rc=/try/demo_ ource/highchart .j / cript cript rc=http://code.highchart .com/highchart -more.j / /head body div id=container tyle=width: 550px; height: 400px; m