2017-04-18 50 views
2

我正在研究angularjs google的柱狀圖。我想在橫軸上顯示文字加粗。我經歷了API,他們建議使用bold:<boolean>這是不工作在我的code.Please建議如何使X軸上的標籤爲粗體。在谷歌柱形圖中以粗體顯示x軸上的文本

js代碼:

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

function drawBasic() { 
     var data = new google.visualization.DataTable(); 
     data.addColumn('timeofday', 'Time of Day'); 
     data.addColumn('number', 'Motivation Level'); 
     data.addRows([ 
     [{v: [8, 0, 0], f: '8 am'}, 1], 
     [{v: [9, 0, 0], f: '9 am'}, 2], 
     [{v: [10, 0, 0], f:'10 am'}, 3], 
     [{v: [11, 0, 0], f: '11 am'}, 4], 
     [{v: [12, 0, 0], f: '12 pm'}, 5], 
     [{v: [13, 0, 0], f: '1 pm'}, 6], 
     [{v: [14, 0, 0], f: '2 pm'}, 7], 
     [{v: [15, 0, 0], f: '3 pm'}, 8], 
     [{v: [16, 0, 0], f: '4 pm'}, 9], 
     [{v: [17, 0, 0], f: '5 pm'}, 10], 
     ]); 

     var options = { 
     title: 'Motivation Level Throughout the Day', 
     bold:'true', 
     hAxis: { 
      title: 'Time of Day', 
      format: 'h:mm a', 
      bold:'true', 
      viewWindow: { 
      min: [7, 30, 0], 
      max: [17, 30, 0] 
      } 
     }, 
     vAxis: { 
      title: 'Rating (scale of 1-10)', 
      bold:"true" 
     } 
     }; 

     var chart = new google.visualization.ColumnChart(
     document.getElementById('chart_div')); 

     chart.draw(data, options); 
    } 

HTML代碼:

<div id="chart_div"></div> 

回答

1

使x軸刻度標記大膽地使用 - >hAxis.textStyle.bold

hAxis: { 
     title: 'Time of Day', 
     format: 'h:mm a', 
     textStyle: { 
     bold:'true', 
     }, 
     viewWindow: { 
     min: [7, 30, 0], 
     max: [17, 30, 0] 
     } 

使x軸標題標籤大膽使用 - >hAxis.titleTextStyle.bold

hAxis: { 
     title: 'Time of Day', 
     format: 'h:mm a', 
     titleTextStyle: { 
     bold:'true', 
     }, 
     viewWindow: { 
     min: [7, 30, 0], 
     max: [17, 30, 0] 
     } 
+0

TEXTSTYLE:{大膽: '真正的'},worked.Thanks。 – joann

1

使用下面的代碼在你的選擇對象
hAxis: { title: 'Time of Day', format: 'h:mm a', titleTextStyle : {bold: 'true'}, viewWindow: { min: [7, 30, 0], max: [17, 30, 0] } }, vAxis: { title: 'Rating (scale of 1-10)', titleTextStyle : {bold: 'true'} }

+0

這應該可以工作。 –