2014-10-16 15 views
9

Google Grafikler ile siyah bir grafik oluşturmaya çalışıyorum ancak eksenin metin rengini değiştiremiyorum. Web üzerinde bulduğum bazı kod parçalarını denedim, örneğin:Google grafikleri - eksen metin rengini değiştirin

hAxis: { 
    color: '#FFF' 
} 

Ancak bu çalışmaz. Başlık ve lejant rengini değiştirmeyi başardım ancak eksen metnini değil. Ben backgroud ile kontrast, beyaz eksen metin rengini ayarlamak çalışıyorum: hAxis için

google.load("visualization", "1", { packages: ["corechart"] }); 
 
setTimeout(function() { 
 
    var options = { 
 
    title: 'Test Chart', 
 
    backgroundColor: '#000', 
 
    legendTextStyle: { color: '#FFF' }, 
 
    titleTextStyle: { color: '#FFF' }, 
 
    hAxis: { 
 
     color: '#FFF', 
 
    } 
 
    }; 
 
    var chart = new google.visualization.LineChart(document.querySelector(".chart")); 
 
    chart.draw(google.visualization.arrayToDataTable(
 
    
 
    [ 
 
     ["Year", "T1", "T2", "T3"], 
 
     [0, 10, 20, 30], 
 
     [1, 10, 20, 30], 
 
     [2, 10, 20, 30], 
 
     [3, 10, 20, 30], 
 
     [4, 10, 20, 30] 
 
    ] 
 
    
 
), options); 
 
    
 
}, 100);
.chart { 
 
    width: 100%; 
 
    height: 200px; 
 
}
<script type="text/javascript" src="https://www.google.com/jsapi"></script> 
 
<div class="chart"></div>

+0

Kullanım durumum biraz farklı: Düzenli grafikler (biçimlendirilmemiş renkler) durumunda metinler siyah yerine gri, dolayısıyla kontrastları düşük. Bu, her parçayı gerçekten siyah olmak üzere manüel olarak düzenlemem ve değiştirmem gerektiği anlamına mı geliyor? –

cevap

18

Doğru kullanım rengi istediğiniz textstyle seçenekleri kullanıyor:

hAxis: { 
    textStyle:{color: '#FFF'} 
} 
Ben de yerine zaman aşımı grafiği oluşturma için google.setOnLoadCallback(drawChart); işlevini kullanarak öneriyoruz

, en azından benim için 100 milisaniye yeterli değildi

+0

Doğru! Teşekkürler ... – LcSalazar

+0

Sadece neye bakıyordum! –

İlgili konular