更改Google可視化運動圖表中氣泡的顏色

Question

我有一種方法可以讓我可以定義 Google可視化API提供的運動圖表中氣泡的顏色？我不想使用默認配色方案。

預先感謝您。

Answer 1

我還沒有找到一個內置的方式來做到這一點。然而，你可以做的是爲每個氣泡分配一個「顏色」變量。然後你可以將氣泡的顏色設置爲這個變量。我已經發現，對於3個氣泡來說，設置1到1，另一個到1.5和第三到第三個項目的合理性很好（在默認配色方案中，黃色項目非常差）。這種方法可以讓您對顏色方案進行有限的控制。

Answer 2

這是2017年，我還沒有找到一個很好的更新。所以這是我想出的解決方案。 HTH。

#views.py 
# Bubble Chart: ID, X, Y Color, Size 
data.append(['ID', 'X', 'Y', 'Category', 'Z']) 
data.append(['', 0, 0, 'Cat 1', 0]) #<-- the order of 
data.append(['', 0, 0, 'Cat 2', 0]) #<-- these fakeout items 
data.append(['', 0, 0, 'Cat 3', 0]) #<-- is important 
data.append(['', 0, 0, 'Cat 4', 0]) #<-- Blue, Red, Orange, Green - in that order 

...的R源： data.append（R.A，r.b，R.C，r.d，R.E）

return render(
    request, 
    'Template.html', 
    { 
     'title':'', 
     'year':datetime.now().year, 
     'org': org, 
     'data': json.dumps(data), 
    } 

#in the scripts block of template.html 

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> 
<script type="text/javascript"> 
    google.charts.load('current', {'packages':['corechart']}); 
    google.charts.setOnLoadCallback(drawChart); 

    function drawChart() { 

     var data = google.visualization.arrayToDataTable({{data|safe}}); 

     var options = { 
      title: 'Bubble By Category Strategy', 
      hAxis: { title: 'X', ticks: [{v: 0, f:''}, {v: 1, f:'L'}, {v: 2, f:'M'}, {v: 3, f:'H'}, {v: 4, f:''}] }, 
      vAxis: { title: 'Y', ticks: [{v: 0, f:''}, {v: 1, f:'L'}, {v: 2, f:'M'}, {v: 3, f:'H'}, {v: 4, f:''}] }, 
      bubble: { 
       textStyle: { 
        fontSize: 11, 
        fontName: 'Lato', 
       } 
      } 
     }; 

     var chart = new google.visualization.BubbleChart(document.getElementById('riskChart')); 
     chart.draw(data, options); 
    } 

</script>