Html2canvas: 線形-角度（0度）のグラデーションがレンダリングされない

作成日 2013年03月11日 · 8コメント · ソース: niklasvh/html2canvas

こんにちは！

まず第一に、ここに素敵なプラグインがあります！私はそのようなものが必要でした;）

グラデーションについて質問があります。

グラデーションは、角度が単語（Top、Left、...）で指定されている場合はレンダリングされますが、角度をDegreeに入力した場合はレンダリングされません（例：linear-gradient（0deg、rgb（0、0、0）0％、rgb（255、255、255）100％）は機能しません）。

これを修正する方法はありますか？度の値を持つグラデーションをたくさん使用しているので:)

ありがとう！

Bug

ソース

nammu

全てのコメント8件

情報をありがとう。

それを修正する方法はありますが、私は現在それをする時間がありません。バックログに追加し、時間があれば元に戻します。

niklasvh 2013年03月14日

おそらく、どのグラデーションも機能しません。
0度とは異なる表記を使用しています。linear-gradient（tobottom、color、color）;

oosterholt 2013年07月18日

この@niklasvhに更新はありますか、私は同じ問題に直面しています。

abhasg 2014年04月08日

この問題を解決するには+1します。 @niklasvhこれを解決するための手がかりを教えていただけますか？

fbotti 2014年06月19日

これには簡単な修正があります。LinearGradientContainerに位置スイッチを存在させる前に、このif追加するだけです。

if (imageData.args[0].indexOf('deg') != -1) {
  var rad = parseFloat(imageData.args[0].substr(0, imageData.args[0].length - 3)) * (Math.PI / 180);
  //Finds y start and scales it between 0 and 1
  this.y0 = (Math.cos(rad) + 1) / 2;
  //Flips y1
  this.y1 = 1 - this.y0;
  //Same as for y0 but flip axis to match with css gradient
  this.x0 = (-Math.sin(rad) + 1) / 2;
  this.x1 = 1 - this.x0;
} else {
  imageData.args[0].split(" ").reverse().forEach(function(position) {
     switch (position) {
          ........
     }
}