2015-01-27 6 views
0

Я установил диаграмму флота jsrender с jsreport.net и в настоящее время терпит неудачу с осью y диаграмм на многостраничных страницах. Как вы можете видеть на втором изображении, ось y не соответствует строкам правильно.Flot, jsrender & phantom: ось метки метки

Update: Вот ссылка площадка:: https://playground.jsreport.net/#playground/WJmSGjkB5/2

Первая страница: First page

Вторая страница:

Second page

Вот текущий исходный фрагмент кода

 var seriesCount = 1; // current data series identifier 

     // drawing series hook 
     dsHook = function(plot, canvascontext, series){ 
      for (var i = 0; i < series.data.length; i++){ 

       // get relative position of plot 
       var offset = plot.offset(); 

       // get data point 
       var dP = series.data[i]; 

       var pos = plot.p2c({x: dP[0], y: dP[1]}); 

       var barWidth = plot.p2c({x: dP[0] + series.bars.barWidth, y: dP[1]}).left - pos.left; 

       var posCorr; 
       // set horizontal position correction 

       switch(seriesCount) { 
        case 1: posCorr = -72; break; 
        case 2: posCorr = -23; break; 
        case 3: posCorr = 24; break; 
        case 4: posCorr = -50; break; 
        case 5: posCorr = 2; break; 
       } 

       pos.left += offset.left + posCorr; 
       pos.top += offset.top - 30; 

       numFormatted = number_format(dP[1], 0, '', '\''); 

       var aDiv = $('<div></div>').css({'width':barWidth, 'background-color':'white','color':'black','font-size':'12px','text-align':'center','position':'absolute','left': pos.left,'top':pos.top}).text(numFormatted).appendTo("body"); 

      } 
      seriesCount++; 
     } 
+0

Вы уверены, что это не проблема css? ваш контейнер может быть не нужного размера для любых созданных флотом элементов. –

+0

css div имеет следующие атрибуты: ширина: 700px; высота: 300px; позиция: относительная; margin: 50px auto; – sullivan

+0

Возможно ли создать JSFiddle, чтобы посмотреть, что там происходит? http://jsfiddle.net/ –

ответ

2

Кажется, что plot.offset().top получает неправильно рассчитывается в dsHook из пространства для заголовка/наценка добавляется для каждой другой страницы.

Первый «решение», чтобы изменить свой расчет, чтобы отразить это:

pos.top += offset.top - 30 + ({{:ID}}-1)*20; 

https://playground.jsreport.net/#playground/WJmSGjkB5/5

«Решение» Во-вторых, чтобы добавить пустой заголовок фиксированного размера конфигурации фантомной, не есть объяснение для этого еще

https://playground.jsreport.net/#playground/WJmSGjkB5/4

Я надеюсь, что я буду обновлять это с лучшей explanat ион/раствор

+0

Действительно очень странно, спасибо за ваши два решения, которые оба работают (отлично). Было бы очень интересно узнать, почему так оно и есть. – sullivan

Смежные вопросы