个人中心
gpt4 book ai didi

javascript - Google Charts ColumnChart 日期格式不显示分钟和小时

转载 作者：行者123 更新时间：2023-11-30 15:10:00 24 4
gpt4 key购买 nike

我正在尝试使用 Google charts 进行专栏聊天纵轴为数字，横轴为日期。由于某种原因，日期格式不打印小时、分钟或秒。它确实适用于年、月和日。

我使用格式“M-d, HH:mm:ss”来格式化和打印这个时间戳:“2017-07-15 20:10:30”但是它打印

7-17,00:00:00 而不是 7-17、20:10:30

这是一个错误还是我遗漏了什么？

<html>
    <head>
    <script src="https://www.google.com/jsapi?ext.js"></script>
    </head>


   <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
      google.charts.load("current", {packages:["corechart"]});
      google.charts.setOnLoadCallback(drawChart);

      function drawChart() 
      {

        var data = new google.visualization.DataTable();
        data.addColumn('date', 'Date');
        data.addColumn('number', 'Present');


        data.addRows([
            [new Date("2017-07-15 20:10:30"), 5]
          ]);

        var view = new google.visualization.DataView(data);
        view.setColumns([0, 1,
                       { calc: "stringify",
                         sourceColumn: 1,
                         type: "string",
                         role: "annotation" 
                        }]);

        var options = {
            width: 600,
            height: 400,
            //bar: {groupWidth: "95%"},
            legend: { position: "none" },
            vAxis: {title: 'Times occured'},
            hAxis: {
                format: "M-d, HH:mm:ss", // <------- This shows: "7-17,00:00:00" not "7-17, 20:10:30"
                //format: "HH:mm",
                //format:'M-d H:mm',

                title: 'Date',
            },
        };
        var chart = new google.visualization.ColumnChart(document.getElementById("chart_div"));
        chart.draw(view, options);
      }
    </script>

<body class="chart">
    <div id="chart_div"></div>
</body>
</html>

最佳答案

看起来像某种错误，

无论如何建议对柱形图使用离散轴(字符串)

您可以使用数据格式化程序来转换 x 轴

请参阅以下工作片段...

google.charts.load("current", {
  callback: drawChart,
  packages:["corechart"]
});

function drawChart() {
  var formatDate = new google.visualization.DateFormat({
    pattern: 'M-d, HH:mm:ss'
  });

  var data = new google.visualization.DataTable();
  data.addColumn('date', 'Date');
  data.addColumn('number', 'Present');
  data.addRows([
    [new Date("2017-07-15 20:10:30"), 5]
  ]);
    
  var view = new google.visualization.DataView(data);
  view.setColumns([{
    calc: function (dt, row) {
      return formatDate.formatValue(dt.getValue(row, 0))
    },
    type: "string",
    label: data.getColumnLabel(0)
  }, 1, {
    calc: "stringify",
    sourceColumn: 1,
    type: "string",
    role: "annotation" 
  }]);

  var options = {
    width: 600,
    height: 400,
    legend: { position: "none" },
    vAxis: {title: 'Times occured'},
    hAxis: {
      title: 'Date'
    }
  };
  var chart = new google.visualization.ColumnChart(document.getElementById("chart_div"));
  chart.draw(view, options);
}
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>

关于javascript - Google Charts ColumnChart 日期格式不显示分钟和小时，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45245414/

24 4 0
文章推荐： javascript - 单击元素 jQuery 时获取父表单类
文章推荐： javascript - 将数组扁平化为一个对象，同时减少一个属性
文章推荐： javascript - Google Maps Api - 不要在 Zoom 上更改 map 中心
文章推荐： javascript - 在javascript中检测独特的滚动事件
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com