2016-08-19 6 views
0

私はdatepickerを使用していますが、私は2つのdatepickersを持っているhighchartsです。Javascript datepicker dateは01-01-1970にデフォルト設定されています。HighCharts

私の問題は、現在の月を表示したい場合は1970にデフォルト設定し続けるということです。 実際に表示されます:01-01-1970。ここで

は私のコードです:

<script type="text/javascript"> 
    $(function() { 


     $.getJSON('test.json?callback=?', function(data) { 


      // Create the chart 
      window.chart = new Highcharts.StockChart({ 

       chart: { 
        renderTo: 'container' 
       }, 

       rangeSelector: { 
        selected: 1, 
        inputDateFormat: '%d-%m-%Y', 
        inputDateParser: function (value) { 
         value = value.split('-'); 
         return Date.UTC(
          parseInt(value[2]), 
          parseInt(value[1]) - 1, 
          parseInt(value[0]) 
         ); 
        }, 
       }, 

       title: { 
        text: 'test' 
       }, 

       plotOptions: { 
        series: { 
         cursor: 'pointer', 
         point: { 
          events: { 
           click: function() { 



           } 
          } 
         } 
        } 
       }, 

       series: [{ 
        name: 'test', 
        data: data, 
        tooltip: { 
         valueDecimals: 2 
       }}] 

      }, function(chart) { 

       // apply the date pickers 
       setTimeout(function() { 
        $('input.highcharts-range-selector', $('#' + chart.options.chart.renderTo)).datepicker() 
       }, 0) 
      }); 
     }); 


     // Set the datepicker's date format 
     $.datepicker.setDefaults({ 
      dateFormat: 'dd-mm-yy', 
      onSelect: function(dateText) { 
       this.onchange(); 
       this.onblur(); 

      }alert(dateText); 
     }); 


    }); 

</script> 

どのように私はこの問題を解決することができますか?

+0

たとえば、datepicker.setDefaultsには、初期日付を設定するオプションがあります。または、目的の日付のchartのrangeSelectorのinputDateParserメソッドを呼び出します。あなたのコードには、使用したい日付への参照が含まれていないか、test.jsonファイルのどこかにありますか? – Shilly

+0

いいえ、jsonファイルに1970年の日付はありません。彼らはすべて2016からです – gafasmill

+0

私は、このコードのどの部分がdatetimeピッカーにjsonの日付を使用するように設定するハイチャートには完全に精通していませんか? jsonファイルをチャートシリーズのデータ​​として使用すると、日付も設定されますか?または、正しい日付でdatepickerを手動で更新するはずですか?それは問題かもしれないので... – Shilly

答えて

1

以下のコードを見ても問題ないですか、私もテストしました。

<html> 
<head> 
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" /> 
<style type="text/css"></style> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/jquery-ui.min.js"></script> 
<script src="http://code.highcharts.com/stock/highstock.js"></script> 
<script src="http://code.highcharts.com/stock/modules/exporting.js"></script> 
<script> 
$(function() { 

    $.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?', function(data) { 
     // Create the chart 
     window.chart = new Highcharts.StockChart({ 
      chart: { 
       renderTo: 'container' 
      }, 

      rangeSelector: { 
       selected: 1, 
       inputDateFormat: '%d-%m-%Y' 
      }, 

      title: { 
       text: 'AAPL Stock Price' 
      }, 

      series: [{ 
       name: 'AAPL', 
       data: data, 
       tooltip: { 
        valueDecimals: 2 
       }}] 

     }, function(chart) { 

      // apply the date pickers 
      setTimeout(function() { 
       $('input.highcharts-range-selector', $('#' + chart.options.chart.renderTo)).datepicker() 
      }, 0) 
     }); 
    }); 


    // Set the datepicker's date format 
    $.datepicker.setDefaults({ 
     dateFormat: 'dd-mm-yy', 
     onSelect: function(dateText) { 
      this.onchange(); 
      this.onblur(); 
     } 
    }); 

}); 
</script> 

<body> 
<div id="container" style="height: 400px; min-width: 600px"></div> 

</body> 
</html> 
+0

これは私と同じように見える? – gafasmill

+0

これもあなたには役に立たないですか? –

+0

はい、これは動作します...唯一の違いは、この "filename = aapl-c.json&callback =?" :o/ – gafasmill

関連する問題