2012-12-08 15 views
10

Używam HighCharts w mojej witrynie PHP poprzez migrację ze starszych wykresów i jestem pod dużym wrażeniem liczby opcji i funkcji wykresów z tą biblioteką.HighCharts: Dodawanie hiperłączy do osi X wykresu

Jednak nie jestem w stanie podać hiperłączy do wartości osi x (lub osi y), aby przejść do innego URI.

Kodeks Kategorie w tym przypadku

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

Czy ktoś może wskazać mi przykład lub dokumentacji Highcharts jeśli są dostępne.

Dzięki

EDIT: Odpowiedź

Oto jsfiddle dla połączonych nazw kategorii: http://jsfiddle.net/a5Bdt/

+0

Oto jsfiddle przykładem dla wyjaśnienia: http://jsfiddle.net/Lc6zx/ chcę ustawić hiperłącze do stycznia do grudnia na osi x na Wiki Strony, – learner

+0

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

+0

Fiddle działa świetnie, ale jeśli chcesz, aby kategorie, które są teraz linkami wyglądać jak wszelkie inne linki w Twojej witrynie dodają useHTML: true po funkcji formatera. – RichP

Odpowiedz

13

Minęło trochę czasu odkąd robiłem pracę w highcharts, ale wierzę, po prostu trzeba udostępniać funkcję formatter. Na przykład:

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

Sądzę, że musiałbyś dodać http://api.highcharts.com/highcharts#xAxis.labels.useHTML, ponieważ domyślnie jest to fałsz. – craig1231

+0

Dzięki chłopaki, czy miałeś okazję wypróbować to jsfiddle ?, to nie działało dla mnie, nie jestem pewien, czy coś przegapiłem – learner

+0

Nie działa również dla mnie. –

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] 
     }] 
    }); 
Powiązane problemy