Encontré una publicación de 2015 que dice que los roles de columna no son compatibles con los gráficos de Material Design. Sin embargo, en la documentación oficial, no puedo encontrar ninguna nota al respecto, así que me pregunto si eso ha cambiado.
Estoy agregando un rol de anotación, pero no parece tener ningún efecto. Lo mismo que otros roles, por ejemplo, tooltip . Para la tooltip , podría solucionarlo usando el formatted value de la celda, pero aún no sé cómo agregar contenido html .
Aquí está mi código:
google.charts.load('current', {'packages':['bar']}); google.charts.setOnLoadCallback(drawStuff); function drawStuff() { var data = new google.visualization.arrayToDataTable([ ['Galaxy', 'Distance', 'Brightness', { role: 'annotation' }], ['Canis Major Dwarf', 8000, 23.3, "BR"], ['Sagittarius Dwarf', 24000, 4.5 , "ME"], ['Ursa Major II Dwarf', 30000, 14.3 , "BR"], ['Lg. Magellanic Cloud', 50000, 0.9, "DA"], ['Bootes I', 60000, 13.1 , "ME"] ]); var options = { width: 800, chart: { title: 'Nearby galaxies', subtitle: 'distance on the left, brightness on the right' }, series: { 0: { axis: 'distance' }, // Bind series 0 to an axis named 'distance'. 1: { axis: 'brightness' } // Bind series 1 to an axis named 'brightness'. }, axes: { x: { distance: {label: 'parsecs'}, // Bottom x-axis. brightness: {side: 'top', label: 'apparent magnitude'} // Top x-axis. } }, focusTarget: 'category', crosshair: { trigger: 'selection', }, }; var chart = new google.charts.Bar(document.getElementById('dual_x_div')); chart.draw(data, options); };La anotación no se muestra en ninguna parte. ¿Qué me estoy perdiendo? enlace jsfiddle aquí.