如何在谷歌图表的条形图上显示图像？

Question

目前，我们正在从Highcharts切换到Google Charts。 使用Highcharts，我们有一个类似

的图表

  

我们根据实际值和平均值之间的差异得到箭头图像（当前图像中的向下红色）。我试图使用谷歌图表实现这一点，但没有得到任何地方。直到现在我只能使用annotationText属性显示HTML。 使用谷歌图表可以完成这项任务吗？有什么工作吗？

Answer 1

在这里，我只提供了如何将某些内容添加到列中的建议，并且您可以应用此选项将箭头附加到条形图上。

您可以对条形图使用注释。以下示例显示了您可以将简单文本注释到条形图。

在此数据表中，我们使用{role：'annotation'}定义一个新列来保存条形标签：

   var data = google.visualization.arrayToDataTable([
     ['Element', 'Density', { role: 'style' }, { role: 'annotation' } ],
     ['Copper', 8.94, '#b87333', 'Cu' ],
     ['Silver', 10.49, 'silver', 'Ag' ],
     ['Gold', 19.30, 'gold', 'Au' ],
     ['Platinum', 21.45, 'color: #e5e4e2', 'Pt' ]
  ]);

同样，您可以通过定义格式化程序并将其包装在如下函数中，将注释格式设置为与要添加的红色向下箭头不同的格式：

function getValueAt(column, dataTable, row) 
{
    return dataTable.getFormattedValue(row, column);
}

有关这方面的更多信息，请参阅this。