get tickages highcharts

Question

Ich habe ein highcharts Streudiagramm, für das ich versuche, die x und y tickPositions in Freemarker Vorlage, insbesondere die erste und letzte zu holen. So, dass ich etwas [-10, -10] (linke untere Ecke) am Schnittpunkt der xy-Achse und [30,40] (rechte obere Ecke) am Schnittpunkt der gegenüberliegenden Seiten bekommen würde, wo xAxis Ticks sind [-10,0,10,20,30] und yAchsen Ticks sind [-10,0,10,20,30,40]

Ich möchte diese Punkte, damit ich in der Lage sein werde, eine diagonale Linie zu zeichnen über das Streudiagramm von der unteren unteren Ecke bis zur oberen rechten Ecke. Die Linie Serie soll wie folgt aussehen:

series: [ 
     { 
      type : 'line', 
      <#--diagonal line--> 
      data :[[-10,-10], [30,40]], // to be calculated dynamically 
      lineWidth: 0.5, 
      marker : { 
       enabled : false 
      } 
     }, 
     { 
      color: 'rgb(0,85,152)', 
      data: [[2,3],[6,7],[8,9]] 
     } 
] 

Das Problem derzeit ist, ich bin nicht in der Lage zu bekommen [-10, -10], [30,40] Datenpunkte. Ist es überhaupt möglich, frage ich mich. Jede Hilfe wird sehr geschätzt!

Answer 1

Sie haben die getExtremes() Funktion auf einer Achse. Zum Beispiel:

var extremes = $('#container').highcharts().yAxis[0].getExtremes(); 

Hier ist die doc, und hier ist ein demo fiddle

Ist das, was Sie erreichen wollten?

bearbeiten

Nach der Geige Beispiel verstehe ich Ihren Bedarf besser. Hier ist die updated fiddle

var chart = $('#container').highcharts(); 
    var extremeY = chart.yAxis[0].getExtremes(); 
    var extremeX = chart.xAxis[0].getExtremes(); 

    var lineSeries = { 
     type: 'line', 
     data: [ 
     [extremeX.min, extremeY.min], 
     [extremeX.max, extremeY.max] 
     ], 
     lineWidth: 0.5, 
     lineColor: 'rgb(0,0,0)', 
     marker: { 
     enabled: false 
     } 
    }; 

    chart.addSeries(lineSeries); 

ich ein Objekt mit den Eigenschaften der Line-Serie erstellt. Und mit min und max (nicht dataMin und dataMax) Eigenschaften aus dem Objekt von getExtremes() zurückgegeben erhalten Sie das gewünschte Ergebnis.

Edit 2

Sie können diesen Code in das load Ereignis des Charts setzen. Es ist ein Rückruf, der nach dem Laden des Diagramms aufgerufen wird. Und hier können Sie this verwenden, um das Diagramm zu entnehmen:

$('#container').highcharts({ 
    chart: { 
     events: { 
     load: function() { 
      var extremeY = this.yAxis[0].getExtremes(); 
      var extremeX = this.xAxis[0].getExtremes(); 

      var lineSeries = { 
      type: 'line', 
      data: [ 
       [extremeX.min, extremeY.min], 
       [extremeX.max, extremeY.max] 
      ], 
      lineWidth: 0.5, 
      lineColor: 'rgb(0,0,0)', 
      marker: { 
       enabled: false 
      } 
      }; 

      this.addSeries(lineSeries); 
     } 
     }, 
     //... 
}); 

Hier ist die new updated fiddle

Answer 2

ist Da Sie nur einen diagonalen Pfad benötigen, dann könnte man es hinzufügen, indem renderer

Beispiel: http://jsfiddle.net/cr7gq4st/

function diagonal() { 
    var chart = this, 
      ren = chart.renderer, 
     diag = chart.diag, 
     attrs = { 
      'stroke-width': 0.5, 
      stroke: '#000', 
      zIndex: 1 
     }, 
     topR = { 
      x: chart.plotLeft + chart.plotWidth, 
      y: chart.plotTop 
     }, 
     bottomL = { 
      x: chart.plotLeft, 
      y: chart.plotTop + chart.plotHeight 
     }, 
     d = 'M ' + bottomL.x + ' ' + bottomL.y + ' L ' + topR.x + ' ' + topR.y; 
    if(!diag) { //if doesn't exist, then create 
     chart.diag = ren.path().attr(attrs).add(); 
    } 
    chart.diag.attr({d:d}); 
}