2016-11-30 2 views
1

Ich habe die API gesucht, kann aber keine definitive Einstellung finden, um mein Diagramm alle Daten im UK-Format (TT/MM/JJJJ) rendern zu lassen.JQuery Highcharts - Daten werden im US-Format nicht empfangen UK

Hier ist die Art, wie ich meine Highchart erzeugen:

<script type="text/javascript"> 
    $(function() { 
     Highcharts.setOptions({ 
      global: { 
       useUTC: false // I added this as I read it will force highcharts to set the locale to that of the browser, but it seems to have no effect 
      } 
     }); 
     Highcharts.chart('container', { 
      title: { 
       text: 'FTE Modelling' 
      }, 
      yAxis: { 
       min: 0, 
       title: { 
        text: 'FTE (Hours)' 
       } 
      }, 
      data: { table: "MainContent_GridView1"}, 
      series: [{ 
       type: 'column', 
       pointWidth: 20 
      }, { 
       type: 'column', 
       pointWidth: 20 
       // total number of column's have been shortened for brevity 
      }, { 
       type: 'spline' 
      }] 
     }); 
    }); 
</script> 

Meine Diagramm, das eine dynamische Tabelle davongemacht werden, die auf der Seite basierend auf unterschiedliche Funktionen verändert, es ist eine führende Spalte hat, die in dem für Daten (dargestellt ist qtip und die x-Achse) und damit habe ich Schwierigkeiten.

Die enthalte Tabelle "MainContent_GridView1" hat die erste Spalte, die Daten aus einer Datenbank ist, und die restlichen Spalten sind für verschiedene FTE-Anforderungen. Aber im Grunde die Tabelle wie folgt aussehen wird:

<table id="MainContent_GridView1"> 
    <thead> 
     <tr> 
      <th></th> 
      <th>nameOfColumn</th> 
      <th>nameOfColumn</th> 
      <th>nameOfColumn</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <th>25/12/2015</th> 
      <td>columnData</td> 
      <td>columnData</td> 
      <td>columnData</td> 
     </tr> 
     <tr> 
      <th>26/12/2015</th> 
      <td>columnData</td> 
      <td>columnData</td> 
      <td>columnData</td> 
     </tr> 
    </tbody> 
</table> 

für Zeile 1 die oben zur Zeit erzeugt ein qtip auf schweben und x-Achse vom 12. 2. Januar 2017 (es summiert sich, was es denkt, dass die Monate sind und auf Erreichen von 12 Schritten fügt es ein weiteres Jahr hinzu).

Für Zeile 2 it 12. Februar 2017 (aus dem gleichen Grund wie oben angegeben) erzeugt

Eine ideale Lösung wäre, eine globale Option zu setzen, so Highcharts so wird es entweder alle Termine behandeln, als durch das Gebietsschema festgelegt (auf diese Weise werden die an die Tabelle gesendeten Daten generiert) oder alternativ das Format aller Daten dauerhaft auf UK gesetzt.

Vielen Dank

elboffor

Antwort

2

bearbeiten für Daten in dem Format, die Sie brauchen. Sie können das Format im Bereich data.dateFormat festlegen. Dadurch können Sie Highcharts sagen, welches Datumsformat Ihre Werte haben.

Gültige Optionen sind:

  • yyyy-mm-dd
  • TT/MM/YYYY
  • mm/tt/
  • TT/MM/JJ
  • mm/dd/JJ

Ich sehe nirgendwo, dass Sie Ihr Datumsformat definieren. Sie müssen Highcharts.dateFormat oder xAxis.labels.format verwenden. Dies kann auf Ihren Tooltips oder Ihren Achsenbeschriftungen (und jedem Etikett) erfolgen. Sie können einstellen, es mag:

xAxis: { 
    type: 'datetime', 
    tickInterval: 7 * 24 * 36e5, // one week 
    labels: { 
     format: '{value: %d/%m/%Y}', 
     align: 'right', 
     rotation: -30 
    } 
}, 
+0

Danke für die Antwort @wergild, Dieser Code setzt den Ausgang, um das Problem das ich habe, ist Highcharts den Eingang unter der Annahme (das in der Tabelle angezeigt) im US-Format und erzeugt die Daten entsprechend, so dass das Problem nicht behoben wird. Ich denke, die Antwort kann mithilfe von Highcharts.dateFormat sein, aber die API zeigt nicht an, wo dies anzuwenden ist. – elboffor

+0

@elboffor, aktualisiert, um Datenformatierung und Diagrammformatierung zu verarbeiten. – wergeld

Verwandte Themen