2009-06-03 3 views
1

Я запускаю приведенный ниже код и получаю пустой график, используя Flot/jQuery. В идеале, то, что я делаю, это гистограмма данных. Я смотрю и смотрю на это без радости - есть ли у кого-нибудь идеи?Пустые карты флота?

<div id="user_breakdown_placeholder" style="width:300px;height:300px"></div> 

<script> 
    $(function() { 
     var d = [["Unassigned", 310],["Maynard Schumm", 274]]; 
      var options = {}; 
     $.plot($("#user_breakdown_placeholder"), d, options); 
    }); 

</script> 
+1

Флот, похоже, не поддерживает эти типы диаграмм –

ответ

2

Текущая версия флота (версия 0.6) поддерживает гистограммы. Вот example. В вашей функции plot() вам просто нужно поставить:

bars: { show: true} 
0

Как говорит Нил Миддлтон в своем комментарии, флот не поддерживает графики штрихового кода.

Возможно, this или this плагин может вам помочь?

+1

Я дам +++ плагин jqcharts, цитируемый Natrium. API Google Charts очень хорош, что дает вам большую гибкость. См. Базовую информацию API по адресу: http://code.google.com/apis/chart/. –

2

Старый вопрос, но я не думаю, что на него ответил. Согласно API документации Flot:

Обратите внимание, что для упрощения внутренней логики в Flot как х и у значения должны быть номера ... Если вы получаете загадочные ошибки, двойной проверки, что вы ввод чисел, а не строк.

Если в приведенном выше примере вы используете строки в своих данных (например, [«Неназначенные», 310]), которые не будут работать в соответствии с документами.

1

Вы можете сделать это, но вам просто нужно немного подделать свои данные.

$(function() { 
    var data = [[0, 310],[1,274]]; 
    var datasets = [ { 
       "data": data 
        }, 
        ]; 
    var options = { 
        bars: {show: true}, 
        yaxis: { min: 0 }, 
        xaxis: { ticks: [ 
            [0.5, "Unassigned"], 
            [1.5, "Maynard Schumm"] 
            ], 
          }, 
        }; 
    $.plot($("#user_breakdown_placeholder"), datasets, options); 
}); 

------>

alt text

Предположительно вы можете изменить свои данные надлежащим образом перед передачей его в Flot.

В FlotUsage имеется множество отличных примеров использования в реальных условиях. например Fedora есть несколько хороших гистограмм. Самое замечательное в том, что это JavaScript, вы можете просматривать идеи источника и кроватки от кого-либо :)

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