如何从Google Chart Timeline隐藏条形标签

Question

I'm trying to remove labels(c1,c2,c3,c4) from my bars.

I tried styling with: timeline: {barLabelStyle: ...} but nothing works for me (I thought about set font color to color of bar, but docs says ,,You can't set the color of barLabel text."

jsfiddle: https://jsfiddle.net/550wb2t0/1/

Answer 1

You can use --> timeline: { showBarLabels: false }

 google.charts.load('44', { callback: drawChart, packages: ['timeline'] }); function drawChart() { var data = google.visualization.arrayToDataTable([ ['Activity', 'Category', 'Start Time', 'End Time'], ['Sleep', 'c1', new Date(2014, 10, 15, 12, 30, 0, 120), new Date(2014, 10, 15, 14, 30, 20, 550) ], ['Eat Breakfast', 'c2', new Date(2014, 10, 15, 12, 30, 55), new Date(2014, 10, 15, 14, 31, 55) ], ['Commute Home', 'c3', new Date(2014, 10, 15, 12, 29, 30), new Date(2014, 10, 15, 14, 30, 0) ], ['Commute Home', 'c4', new Date(2014, 10, 15, 14, 30), new Date(2014, 10, 15, 18) ] ]); var colors = []; var colorMap = { // should contain a map of category -> color for every category c1: '#e63b6f', c2: '#19c362', c3: '#592df7', c4: '#000000' } for (var i = 0; i < data.getNumberOfRows(); i++) { colors.push(colorMap[data.getValue(i, 1)]); } console.log(JSON.stringify(colors)); var options = { height: 450, colors: colors, timeline: { showBarLabels: false } }; var chart = new google.visualization.Timeline(document.getElementById('chart_div')); chart.draw(data, options); } 

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