スプライングラフグラデーション塗りつぶし

Question

初めてハイチャートを使用していますが、かなり印象的です。私はのようなものを達成しようとしていますが ：

はHightchartsを使用して、それは可能ですか？私は円グラフにグラデーションを追加することができますが、どのように達成するのかはわかりません。チャートに背景イメージを設定できますか？

Answer 1

使用して背景画像や勾配を設定することが可能である。しかし、これはプロットエリアの背景である

chart: { 
     type: 'line', 
     plotBackgroundImage: 'http://www.highcharts.com/demo/gfx/skies.jpg' 
    }, 

又は

chart: { 
     type: 'line', 
     plotBackgroundColor: { 
      linearGradient: [0, 0, 500, 500], 
      stops: [ 
       [0, 'rgb(255, 255, 255)'], 
       [1, 'rgb(200, 200, 255)'] 
      ] 
     } 
    }, 

http://api.highcharts.com/highcharts#chart.plotBackgroundImage 又は http://api.highcharts.com/highcharts#chart.plotBackgroundColor

を、ラインそのものではありません。線に段階的な色を付けるには、系列の色をグラデーションとして指定します。例えば

series: [{ 
     data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4], 
     color: { 
      linearGradient: [0, 0, 0, 500], 
      stops: [ 
       [0, 'rgb(255, 255, 255)'], 
       [1, 'rgb(100, 100, 155)'] 
      ] 
     } 
    }] 

http://jsfiddle.net/wXqM9/

linearGradientsの構文は次のとおり

linearGradient: [x1, y1, x2, y2] 

は（X1、Y1）と（X2、Y2）のエンドポイントの開始点との直線勾配オブジェクトを作成します。

stops: [ 
       [0, 'rgb(255, 255, 255)'], 
       [1, 'rgb(100, 100, 155)'] 
      ] 

これは、グラデーションの2つの点と使用する色を指定します。この場合、勾配は最初の（255,255,255）から（100,100,155）と最後になります。 3つのストップを指定した場合、グラデーションを途中のある色から最後の色へと変更できます。お役に立てれば。私はそれがどのように動作するかを見るために投稿したjsfiddleでこのことを試してみることをお勧めします。

Answer 2

グラフの背景を設定するには、chart.plotBackgroundImageを使用します。チャート全体にイメージを設定する場合は、コンテナにCSSスタイルを使用します。勾配について

が、それは動作しますが、見てみましょう：http://jsfiddle.net/Fusher/2Gzkd/3/

 color: { 
      linearGradient: { 
       x1: 0, 
       y1: 0, 
       x2: 0, 
       y2: 1 
      }, 
      stops: [ 
       [0, 'red'], 
       [0.5, 'green'], 
       [1, 'blue'] 
      ] 
     },