Googleエリアチャートの塗りつぶしとストロークの色が異なります

Question

下の画像をご覧ください。私は必要なもの

黄色の代わりに、グレーを持っていることですが、それは、Googleのエリアチャートに塗りつぶしの色は、常にストロークの色と同じであると思われる、あなたはわずか0.5であるareaOpacityを指定することができますこの特定の場合には、

は今、この画像を参照してください：

を私は手動で<path>要素の塗りつぶしの色を変更することができますが、チャートAPIで公開されていないようです。少なくとも、私は&サイトとドキュメントを通過し、見つからなかった。私はそれを見逃していないといいのに。似たような問題があるかどうか、回避策が存在するかどうかを誰かに伝えることができますか？

Answer 1

あなたは'style'column role

使用可能なスタイルをしている使用することができます...

色
不透明度
ストローク幅
ストローク色
ストロークの不透明
塗りつぶしの色
塗りつぶし不透明度

は

華麗だ

google.charts.load('current', {'packages':['corechart']}); 
 
google.charts.setOnLoadCallback(drawChart); 
 

 
function drawChart() { 
 
    var areaStyle = 'fill-color: #ffeb3b; stroke-color: #b71c1c; stroke-width: 8;'; 
 

 
    var dataTable = new google.visualization.DataTable({ 
 
    cols: [ 
 
     {label: 'Year', type: 'string'}, 
 
     {label: 'Sales', type: 'number'}, 
 
     {role: 'style', type: 'string'} 
 
    ], 
 
    rows: [ 
 
     {c:[{v: '2013'}, {v: 1000}, {v: areaStyle}]}, 
 
     {c:[{v: '2014'}, {v: 1200}, {v: areaStyle}]}, 
 
     {c:[{v: '2015'}, {v: 1400}, {v: areaStyle}]}, 
 
     {c:[{v: '2016'}, {v: 1800}, {v: areaStyle}]} 
 
    ] 
 
    }); 
 

 
    var chart = new google.visualization.AreaChart(document.getElementById('chart_div')); 
 
    chart.draw(dataTable, { 
 
    areaOpacity: 1.0, 
 
    legend: { 
 
     position: 'none' 
 
    } 
 
    }); 
 
}

<script src="https://www.gstatic.com/charts/loader.js"></script> 
 
<div id="chart_div"></div>

Answer 2

OK、回避策が見つかりました。ここで

は仕事をしてjQueryのコードです：

$("#chart_div").find("path[stroke='none']").attr("fill","#ffff00"); 

そして、ここではそれがどのように見えるかです。複数のパス要素があり、ストロークが設定されていないものだけが必要であることに注意してください。

私はまだAPIで、このためのオプションを見つけることができない、ドキュメントが、これはどちらかサポートされていないことを明示的に指定されていません。

編集：@WhiteHatで受け付けられた回答をご覧ください。