2012-05-31 5 views
7

Używam flotr do wykreślenia 90 zestawów danych. Średnio tylko dwa z 90 zestawów danych rzeczywiście wytworzą linię graficzną. Pozostałe 88 lub tak będzie miało tak niskie wartości y, że ledwo osiągną szczyt powyżej osi x. Oto przykład ...flotr wyświetla nazwę serii danych, gdy mysz unosi się nad linią

enter image description here

Moim problemem jest to, że nie wiem co ustawić te dane są dwie linie. Mogłem stworzyć legendę, ale legenda byłaby ogromna, ponieważ istnieje około 90 zestawów danych. Zastanawiałem się więc, czy flotr ma funkcję oznaczania tych zestawów danych, gdy mysz unosi się nad wykreślonymi danymi dla tego zestawu danych. Czy taka funkcja istnieje? Dzięki.

Odpowiedz

9

OK, znalazłem odpowiedź. Widziałem ten przykład ...

http://phenxdesign.net/projects/flotr/examples/prototype/mouse-tracking.html

Ten wykorzystuje wsparcie śledzenia ale to tylko pokazuje wartości X i Y. Widziałem ten wiersz ....

trackFormatter: function(obj){ return 'x = ' + obj.x +', y = ' + obj.y; } 

i zmienił go do tego ...

trackFormatter: function(obj){ return 'x = ' + obj.x +', y = ' + obj.y +', Data Series = ' + obj.series.label; } 

Potem podano etykietę danych dla każdego zestawu danych i przekazał je do Flotr.draw w asocjacyjną szyk. Zrobiłem to przez zmianę tego ...

[dataset1, dataset2] 

do tego ...

[{data:dataset1,label:'label_for_dataset1'}, {data:dataset2,label:'label_for_dataset2'}] 

Poniżej jest przykład zmiany zrobiłem. Teraz wskaźnik myszy pokazuje wartości xiy i dowolną etykietę danych, którą wpisujesz.

Przed:

var dataset1 = [[100, 4.09453e-29], [99, 1.41672e-28],...... ]; 
var dataset2 = [[100, 9.48582e-19], [99, 1.88215e-18],...... ]; 

var f = Flotr.draw(
     $('container'), 
     [dataset1, dataset2], 
     { 
      mouse:{ 
       track: true, 
       lineColor: 'purple', 
       relative: true, 
       position: 'ne', 
       sensibility: 1, // => The smaller this value, the more precise you've to point 
       trackDecimals: 2, 
       trackFormatter: function(obj){ return 'x = ' + obj.x +', y = ' + obj.y; } 
      }, 
      crosshair:{ 
       mode: 'xy' 
      } 
     } 
    ); 

Po:

var dataset1 = [[100, 4.09453e-29], [99, 1.41672e-28],...... ]; 
var dataset2 = [[100, 9.48582e-19], [99, 1.88215e-18],...... ]; 

var f = Flotr.draw(
     $('container'), 
     [{data:dataset1,label:'enter_label_for_dataset1_here'}, {data:dataset2,label:'enter_label_for_dataset2_here'}], 
     { 
      mouse:{ 
       track: true, 
       lineColor: 'purple', 
       relative: true, 
       position: 'ne', 
       sensibility: 1, // => The smaller this value, the more precise you've to point 
       trackDecimals: 2, 
       trackFormatter: function(obj){ return 'x = ' + obj.x +', y = ' + obj.y +', Data Series = ' + obj.series.label; } 
      }, 
      crosshair:{ 
       mode: 'xy' 
      } 
     } 
    );