Google Materials Charts (Scatter) not showing trendlines or tooltips

问题

I'm using Google charts, Materials Charts running in IE v11, and when I do things like trendlines and tooltips no longer work. The same happens if I add a column {type: 'string', role: 'tooltip'}, nothing appears. If I change

'packages':['scatter']

'packages':['corechart']

and

google.charts.Scatter(...);

google.visualization.scatterchart(...);

then it works as listed in the documentation. I don't know what I am missing here. Below is an example of trendlines not working. I've searched other questions but can't really find an answer.

<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>

回答1:

After looking deeper into Google's Material Chart information I found on their website:

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

Trendlines and tooltips fall under the options section of creating charts since they need the options structure to further define them. Again, as of this date (March 2015) the Google Materials Charts do not support these features. If you want to use things like trendlines and tooltips you need to use non material charts (e.g. packages['corechart'] and not packages['scatter']).

回答2:

For what it's worth, you may have been loading the wrong version of Google's charts. You referenced '1' where it should be '1.1' for material charts. Like so:

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

来源：https://stackoverflow.com/questions/29087162/google-materials-charts-scatter-not-showing-trendlines-or-tooltips

标签

javascript

charts

google-visualization

tooltip