在Google条形图中，我可以设置不同的单轴标签吗？

Question

考虑this JSFiddle中的条形图。

有没有办法改变只有一个垂直轴标签的样式？例如，我可以改变“TX，Houston”而不会影响其他城市名称吗？

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

function drawMultSeries() { 
     var data = google.visualization.arrayToDataTable([ 
     ['City', '2010 Population', '2000 Population'], 
     ['New York City, NY', 8175000, 8008000], 
     ['Los Angeles, CA', 3792000, 3694000], 
     ['Chicago, IL', 2695000, 2896000], 
     ['Houston, TX', 2099000, 1953000], 
     ['Philadelphia, PA', 1526000, 1517000] 
     ]); 

     var options = { 
     title: 'Population of Largest U.S. Cities', 
     chartArea: {width: '50%'}, 
     hAxis: { 
      title: 'Total Population', 
      minValue: 0 
     }, 
     vAxis: { 
      title: 'City' 
     } 
     }; 

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

Answer 1

一个办法是等待图表的'ready'事件，

然后更改<text>元素属性为'font-weight'

看到下面的工作片段...

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

 
function drawMultSeries() { 
 
    var data = google.visualization.arrayToDataTable([ 
 
    ['City', '2010 Population', '2000 Population'], 
 
    ['New York City, NY', 8175000, 8008000], 
 
    ['Los Angeles, CA', 3792000, 3694000], 
 
    ['Chicago, IL', 2695000, 2896000], 
 
    ['Houston, TX', 2099000, 1953000], 
 
    ['Philadelphia, PA', 1526000, 1517000] 
 
    ]); 
 

 
    var options = { 
 
    title: 'Population of Largest U.S. Cities', 
 
    chartArea: {width: '50%'}, 
 
    hAxis: { 
 
     title: 'Total Population', 
 
     minValue: 0 
 
    }, 
 
    vAxis: { 
 
     title: 'City' 
 
    } 
 
    }; 
 

 
    var container = document.getElementById('chart_div'); 
 
    var chart = new google.visualization.BarChart(container); 
 
    google.visualization.events.addListener(chart, 'ready', function() { 
 
    Array.prototype.forEach.call(container.getElementsByTagName('text'), function (label) { 
 
     if (label.innerHTML === 'Houston, TX') { 
 
     label.setAttribute('font-weight', 'bold'); 
 
     } 
 
    }); 
 
    }); 
 
    chart.draw(data, options); 
 
}

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