Question

我想按月对数据分组并一起显示。

当前，xAxis显示月份和日期，但是我只想显示月份。同一个月的值必须在一起

因此，正确的解决方案应该是2个月。 11月和12月，其中12月有2列（蓝色和右边的红色一列）

重要的是要知道我想使用物料图

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

JS

google.charts.load('current', {packages: ['corechart', 'bar']});
google.charts.setOnLoadCallback(drawTitleSubtitle);


    function drawTitleSubtitle() {
        var data = new google.visualization.DataTable();
        data.addColumn('date', 'Month');
        data.addColumn('number', 'Buys');
        data.addColumn('number', 'Sells');

        data.addRows([
                [new Date(2018, 11, 1), 18636 , null],
                [new Date(2018, 10, 1), null, 20764],
                [new Date(2018, 11, 1), null, 63725]
        ]);

        var options = {
          chart: {
            title: 'Shares traded by insiders ( People who have at least 10% of the company)',
          },
          axes: {
            x: {
                format: 'MMM d, y',
                label: 'test'
            },
            y: {
                distance: {label: 'parsecs'}, // Left y-axis.
                brightness: {side: 'right', label: 'apparent magnitude'} // Right y-axis.
              }
          },
        };

        var materialChart = new google.charts.Bar(document.getElementById('chart_div'));
        materialChart.draw(data, options);
      }

Answer 1

可能使用的是旧版Google Charts API，但使用的是Material Theme。

var options = {
            hAxis: {
              format: 'MM yyyy'
            },
            theme: 'material',
            vAxis: {
              title: 'Amount'
            }
};
var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
chart.draw(data, options);

Google Material Charts在xAxis和格式日期上按月分组

1 个答案: