使用日期作为x轴的dygraph中的高照明数据

时间:2016-05-11 18:37:46

标签: javascript dygraphs

我无法使用Date作为我的轴来突出显示我的dygraph。如果我只使用数字作为x轴但不使用日期,它可以工作。这只是我正在做的一个例子。我尝试了很多东西,但仍然没有运气,任何帮助都会很棒。

 <!DOCTYPE html>
<html>
<head>
    <script>
    function reveal(toshow) {
    document.getElementById(toshow).style.display='block';
    return false;}
    </script>





<script type="text/javascript" src="dygraph-combined-dev.js"></script>
    <title></title>
</head>
<body>
<div>make sure</div>
  <div id="graphdiv" style="width:800px; height:500px;"></div>




  <script type="text/javascript" >

    g = new Dygraph(
document.getElementById("graphdiv"),
 "myTime,INTERCEPTOR LEVEL \n" +
"01/01/2016,3 \n" +
"01/02/2016,9 \n" +
"01/03/2016,15 \n" +
"01/04/2016,6 \n" +
"01/06/2016,8 \n" +
"01/07/2016,7 \n" +
"01/08/2016,5 \n" +
"01/09/2016,1 \n" +
"01/10/2016,10 \n" ,

   { underlayCallback: 
function(canvas, area, g) {
   var bottom_left = g.toDomCoords("01/04/2016", 0);
              var top_right = g.toDomCoords("01/05/2016", +14);

              var left = bottom_left[0];
              var right = top_right[0];




        canvas.fillStyle = "rgba(255, 255, 102, 1.0)";

              canvas.fillRect(left, area.y, right - left , area.h);




   }


}           

);
     </script>



</body>
</html>

3 个答案:

答案 0 :(得分:0)

我发现我必须将用于高亮显示的dateTime转换为自1970年以来的毫秒数。然后将该数字传递给 g.toDomXCoord(自1970年以来的毫秒数)。这将使它发挥作用。

答案 1 :(得分:0)

您需要使用新的日期而不是字符串格式。

   var bottom_left = g.toDomCoords(new Date('2007/07/01'), -90);
   var top_right = g.toDomCoords(new Date('2008/01/01'), +90);

see the output

答案 2 :(得分:0)

杀死双引号。那工作。