2012-12-08 14 views
10

Ich habe HighCharts in meiner PHP-Website verwendet, indem ich es von älteren Diagrammen migriert habe, und ich bin sehr beeindruckt von der Anzahl der Grafikoptionen und Funktionen mit dieser Bibliothek.HighCharts: Hinzufügen von Hyperlinks zur X-Achse des Diagramms

Allerdings kann ich keine Hyperlinks zu den Werten der X-Achse (oder Y-Achse) bereitstellen, um zu einem anderen URI zu navigieren.

Code of Kategorien in diesem Fall

xAxis: { 
    categories: [ 
     'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec' 
    ] 
}, 

Kann mir jemand ein Beispiel oder Dokumentation von Highcharts zeigen, wenn verfügbar.

Dank

EDIT: ANTWORT

Hier ist die jsfiddle für verlinkte Kategorienamen: http://jsfiddle.net/a5Bdt/

+0

Hier ist die jsfiddle Beispiel zur Verdeutlichung: http://jsfiddle.net/Lc6zx/ i den Hyperlink für Januar bis Dezember auf der x-Achse festlegen möchten Seiten Wiki, – learner

+0

Related/Duplicate http://stackoverflow.com/questions/12758465/how-to-handle-mouse-events-on-axis-labels-in-highcharts –

+0

Fiddle funktioniert gut, aber wenn Sie möchten, dass die Kategorien, die jetzt Links sind wie aussehen Alle anderen Links auf Ihrer Website fügen useHTML: true nach der Formatierungsfunktion hinzu. – RichP

Antwort

13

Es ist eine Weile her, dass ich Arbeit in highcharts getan haben, aber ich glaube, man muss nur Stellen Sie eine formatter Funktion zur Verfügung. Zum Beispiel:

xAxis: { 
    categories: [ 
     'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec' 
    ], 
    labels: { 
     formatter: function() { 
      return '<a>' + this.value + '</a>' 
     }, 
     useHTML: true 
    } 
}, 
+3

Ich glaube auch, dass Sie http://api.highcharts.com/highcharts#xAxis.labels.useHTML hinzufügen müssen, da dies standardmäßig false ist. – craig1231

+0

Danke Jungs, hast du eine Chance es zu versuchen jsfiddle ?, es hat nicht funktioniert für mich, nicht sicher, ob ich etwas verpasst habe – learner

+0

Hat auch nicht für mich gearbeitet. –

3
var categoryLinks = { 
     'Foo': 'http://www.google.com', 
     'Bar': 'http://www.facebook.com', 
     'Foobar': 'http://www.stackoverflow.com' 
    }; 
    $('#container').highcharts({ 
     xAxis: { 
      categories: ['Foo', 'Bar', 'Foobar'], 

      labels: { 
       formatter: function() { 
        return '<a href="' + categoryLinks[this.value] + '">' + 
         this.value + '</a>'; 
       } 
      } 
     }, 
     series: [{ 
      data: [300, 200, 600] 
     }] 
    }); 
Verwandte Themen