Question

我在这里使用谷歌日历图表示例：

<html>
  <head>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.load("visualization", "1.1", {packages:["calendar"]});
      google.setOnLoadCallback(drawChart);

   function drawChart() {
       var dataTable = new google.visualization.DataTable();
       dataTable.addColumn({ type: 'date', id: 'Date' });
       dataTable.addColumn({ type: 'number', id: 'Won/Loss' });
       dataTable.addRows([
          [ new Date(2018, 06, 13), 37032 ],
          [ new Date(2018, 06, 14), 38024 ],
          [ new Date(2018, 06, 15), 38024 ],
          [ new Date(2018, 07, 16), 38108 ],
          [ new Date(2018, 07, 17), 38229 ],

          [ new Date(2018, 08, 13), 37032 ],
          [ new Date(2018, 08, 14), 38024 ],
          [ new Date(2018, 08, 15), 38024 ],
          [ new Date(2018, 09, 16), 38108 ],
          [ new Date(2018, 09, 17), 38229 ],

          [ new Date(2018, 10, 13), 37032 ],
          [ new Date(2018, 10, 14), 38024 ],
          [ new Date(2018, 10, 15), 38024 ],
          [ new Date(2018, 11, 16), 38108 ],
          [ new Date(2018, 11, 17), 38229 ],

          [ new Date(2018, 12, 16), 38108 ],
          [ new Date(2018, 12, 17), 38229 ],

          // Many rows omitted for brevity.
          [ new Date(2019, 1, 4), 38177 ],
          [ new Date(2019, 1, 5), 38705 ],
          [ new Date(2019, 1, 12), 3821 ],
          [ new Date(2019, 1, 13), 38029 ],
          [ new Date(2019, 2, 19), 38823 ],
          [ new Date(2019, 2, 23), 38345 ],
          [ new Date(2019, 2, 24), 38436 ],
          [ new Date(2019, 2, 30), 38447 ],

          [ new Date(2019, 3, 4), 38177 ],
          [ new Date(2019, 3, 5), 38705 ],
          [ new Date(2019, 3, 32), 3821 ],
          [ new Date(2019, 3, 13), 38029 ],
          [ new Date(2019, 4, 19), 38823 ],
          [ new Date(2019, 4, 23), 38345 ],
          [ new Date(2019, 4, 24), 38436 ],
          [ new Date(2019, 4, 30), 38447 ],

          [ new Date(2019, 5, 4), 58177 ],
          [ new Date(2019, 5, 5), 58705 ],
          [ new Date(2019, 5, 22), 5821 ],
          [ new Date(2019, 5, 13), 38029 ]

        ]);

       var chart = new google.visualization.Calendar(document.getElementById('calendar_basic'));

       var options = {
         title: "Red Sox Attendance",
         height: 350,
       };

       chart.draw(dataTable, options);
   }
    </script>
  </head>
  <body>
    <div id="calendar_basic" style="width: 1000px; height: 350px;"></div>
  </body>
</html>

如您所见，在此示例中，我使用了即将到来的12个月数据。我可以删除空白月份，年份指标，只显示下一个月的开始日期和最后一个月的日历 - 单行/图表吗？

如果没有，您是否知道可以执行此操作的Google Chart Calendar的替代方案？谢谢

谷歌图表日历 - 全年提升12个月

0 个答案: