Я просто познакомился с D3 и очень люблю crossfilter library. Я хотел бы сгенерировать что-то подобное, но вместо данных полету у меня есть данные CSV в формате: row, col, value.
Мне нужна только одна гистограмма, показывающая значения, и таблица, отсортированная по полю значений.
Трудно понять, что происходит в их примере.
Может ли кто-нибудь предложить или показать очень простой пример?
Я наткнулся на БОЛЬШУЮ библиотеку, которая сделает это для меня.
Лучший "очень простой" пример для crossfilter, с которым я столкнулся, - это сообщение о блоге "Инвестиционный блог". Изучите многовариантные данные с помощью CrossFilter
Здесь также имеется относительно прямой пример:
http://bl.ocks.org/phoebebright/3822981
http://bl.ocks.org/phoebebright/raw/3822981/
На этой странице есть несколько полезных уроков для начала. https://github.com/mbostock/d3/wiki/Tutorials
D3 имеет довольно крутую кривую обучения, и вам нужно понять следующие примеры, прежде чем понимать пример crossfilter:
Первые 7 учебников написаны автором D3, и он научит вас этой базовой концепции. (Второй - самый интуитивный) Пример Скотта Мюррея очень легко понять и, кажется, быстрее учиться по сравнению с оригиналом. Учебник Christophe Viau является коротким и быстрым для изучения, но не обязательно охватывает достаточно деталей.
Я также новичок в D3, но нашел эту библиотеку очень умной и мощной. Удачи.
Надеюсь, эта ссылка, которая дает очень простой пример, поможет любому, кто спотыкается: Очень простой пример JS Fiddle
var data = crossfilter([
{date: "2011-11-14T16:17:54Z", quantity: 2, total: 190, tip: 100, type: "tab"},
{date: "2011-11-14T16:20:19Z", quantity: 2, total: NaN, tip: 100, type: "tab"},
{date: "2011-11-14T16:28:54Z", quantity: 1, total: 300, tip: 200, type: "visa"},
{date: "2011-11-14T16:30:43Z", quantity: 2, total: 90, tip: 0, type: "tab"},
{date: "2011-11-14T16:48:46Z", quantity: 2, total: 90, tip: 0, type: "tab"},
{date: "2011-11-14T16:53:41Z", quantity: 2, total: 90, tip: 0, type: "tab"},
{date: "2011-11-14T16:54:06Z", quantity: 1, total: NaN, tip: null, type: "cash"},
{date: "2011-11-14T17:02:03Z", quantity: 2, total: 90, tip: 0, type: "tab"},
{date: "2011-11-14T17:07:21Z", quantity: 2, total: 90, tip: 0, type: "tab"},
{date: "2011-11-14T17:22:59Z", quantity: 2, total: 90, tip: 0, type: "tab"},
{date: "2011-11-14T17:25:45Z", quantity: 2, total: 200, tip: null, type: "cash"},
{date: "2011-11-14T17:29:52Z", quantity: 1, total: 200, tip: 100, type: "visa"}]);
try {
var total_dimension = data.dimension(function(d) { return d.total; });
var na_records = total_dimension.filter(90).top(Infinity);
var elRecords = $('ul#records');
elRecords.empty();
for (var i = 0; i < na_records.length; i++) {
$('<li>', { text : na_records[i].total}).appendTo(elRecords);
}
} catch (e) {
console.log(e);
}
Для диаграмм я также рекомендовал бы библиотеку dc.js для быстрого прототипирования, поскольку она имеет встроенную поддержку Crossfilter.
Не похоже, чтобы кто-то действительно обратился к части "основного примера" вопроса. Помимо некоторых ссылок типа RTFM. Я согласен с этим, но если люди похожи на меня, то они хотят прототипировать что-то быстро как часть технической оценки, прежде чем вкладывать много времени в основы.