Highcharts影/圖填寫

Question

我與D3圖形庫的工作，但由於其缺乏原生支持IE8，我想切換到HighCharts。

使用D3，我能夠用「填充」屬性創建使用CSS類如下圖。

有5個系列已經產生了圖形值;所述第一限定淺灰色區域的頂部，所述第二限定了暗灰色區域的頂部，第三定義藍線等

是否有可能創建使用HighCharts類似的東西？

Answer 1

可能是因爲你可以在這裏看到在http://www.highcharts.com/demo/area-negative

HTML：

<script src="https://code.highcharts.com/highcharts.js"></script> 
<script src="https://code.highcharts.com/modules/exporting.js"></script> 

<div id="container" style="min-width: 310px; 
    height: 400px; margin: 0 auto"></div> 

使用Javascript/jQuery的：

$(function() { 
    $('#container').highcharts({ 
     chart: { 
      type: 'area' 
     }, 
     title: { 
      text: 'Area chart with negative values' 
     }, 
     xAxis: { 
      categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas'] 
     }, 
     credits: { 
      enabled: false 
     }, 
     series: [{ 
      name: 'John', 
      data: [5, 3, 4, 7, 2] 
     }, { 
      name: 'Jane', 
      data: [2, -2, -3, 2, 1] 
     }, { 
      name: 'Joe', 
      data: [3, 4, 4, -2, 5] 
     }] 
    }); 
}); 

鏈接的jsfiddle：http://jsfiddle.net/gh/get/jquery/1.9.1/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/area-negative/