Highcharts 圆形进度条式测量图.pdfVIP

Highcharts 圆形进度条式测量图 Highcharts 圆形进度条式测量图 Highcharts 测量图 以下实例演⽰了圆形进度条式测量图。 我们在前⾯的章节已经了解了 Highcharts 基本配 语法。接下来让我们来看下其他的 配 。 配置 chart.type 配置 配 chart 的 type 为 solidguage 。chart .type 描述了图表类型。默认值为 line。 var chart = { type: solidguage }; pane 配置 pane 只适⽤在极坐标图和⾓度测量仪。此可配 对象持有组合x轴和y周的常规选项。 每个x轴和y轴都可以通过索引关联到窗格中。 var pane = { startAngle: -150, // 轴或测量轴的开始度数，以度数的⽅式给出。0是北 endAngle: 150 // 轴极坐标或⻆度轴的最终度数，以度数的⽅式给出。0是北 }; 实例 ⽂件名：highcharts_guage_solid .htm html head meta charset=UTF-8 / titleHighcharts 教程 | W3Cschool教程()/title script src=/libs/jquery/2.1.4/jquery .min.js script src=/highcharts.js/script script src=/highcharts-more.js/scri script src=/modules/solid-gauge.js/ /head body div style=width: 600p ; height: 400p ; margin: 0 auto div id=container-speed style=width: 300p ; height: 200 div id=container-rpm style=width: 300p ; height: 200p /div script language=JavaScript $(document).ready(function() { var chart = { type: solidgauge }; var title = null; var pane = { center: [50% , 85% ], size: 140% , startAngle: -90, endAngle: 90, background: { backgroundColor: (Highcharts.theme Highcharts.theme.ba innerRadius: 60% , outerRadius: 100% , shape: arc } }; var tooltip = { enabled: false }; // the value a is var yA is = { stops: [ [0.1, #55BF3B], // green [0.5, #DDDF0D], // yellow [0.9, #DF5353] // red ], lineWidth: 0, minorTickInterval: null, tickPi elInterval: 400, tickWidth: 0, title: { y : -70 }, labels: { y : 16 }, min: 0, ma : 200, title: { te t: Speed } }; var plotOptions = { solidgauge: { dataLabels: { y : 5,