Google 材料图表（散点图）未显示趋势线或工具提示

Question

我在 IE v11 中使用 Google 图表、材料图表运行，当我做诸如趋势线和工具提示之类的事情时，它们不再起作用。如果我添加列 {type: 'string', role: 'tooltip'}，也会发生同样的情况，但什么也没有出现。如果我改变

'packages':['scatter']

到

'packages':['corechart']

和

google.charts.Scatter(...);

到

google.visualization.scatterchart(...);

然后它将按照文档中列出的方式工作。我不知道我在这里错过了什么。以下是趋势线不起作用的示例。我搜索了其他问题，但找不到真正的答案。

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
    google.load('visualization', '1.1', {'packages':['scatter']});
    google.setOnLoadCallback(drawChart);

    function drawChart() {
        var data = new google.visualization.DataTable();
        data.addColumn('date', 'Date');
        data.addColumn('number', 'Y');

        data.addRows([
            [new Date(2015, 0, 7), 2],
            [new Date(2015, 0, 7), 10],
            [new Date(2015, 1, 2), 3],
            [new Date(2015, 1, 3), 4],
            [new Date(2015, 2, 9), 2]
        ]);

        var chart = new google.charts.Scatter(document.getElementById('chart'));

        var options = {

            trendlines: {
                0: {
                    type: 'linear',
                    color: 'black',
                    lineWidth: 2,
                    opacity: 0.3,
                    showR2: true,
                    visibleInLegend: true
                }
            }
        };

        chart.draw(data, options);
    }
</script>

Answer 1

在深入了解 Google's Material Chart 信息后，我在他们的网站上找到了：

The Material Charts are in beta. The appearance and interactivity are largely final, but the way options are declared is not.

趋势线和工具提示属于创建图表的 options 部分，因为它们需要 options 结构来进一步定义它们。同样，截至该日期（2015 年 3 月），Google 材料图表不支持这些功能。如果你想使用趋势线和工具提示之类的东西，你需要使用非 material 图表（例如 packages['corechart'] 而不是 packages['scatter']）。

Answer 2

尽管如此，您可能加载了错误版本的 Google 图表。对于 material 图表，您引用了“1”，而它应该是“1.1”。像这样：

    google.load('visualization', '1.1', { packages: ['scatter'] });

Google 材料图表（散点图）未显示趋势线或工具提示

Google Materials Charts (Scatter) not showing trendlines or tooltips

javascript

charts

tooltip

google-visualization