Комментарии 42
Шикарное кото
Почему автор называет котов на фотографиях «кошками»? Видно же по морде, что кот :)
А почему обошли стороной собачников! безобразие!
Перепробовал много js-chart библиотек, но остаюсь верен гугловским чартам.
Как-то из _коробки_ они смотрятся «презентабельными», без попугайской расцветки.
Касательно темы, с ходу в документации не нашел, если в line chart отдельные события для клика на элементах легенды?
Как-то из _коробки_ они смотрятся «презентабельными», без попугайской расцветки.
Касательно темы, с ходу в документации не нашел, если в line chart отдельные события для клика на элементах легенды?
В вебе существует огромное количество хороших решений.
Вполне вероятно, что вам они уже хорошо подходят.
Что касается расцветки, у нас из коробки три палитры — больше решили пока не делать; зато сделали всё, чтобы задать свою палитру можно было максимально просто.
По вопросу о кликах на элементы легенды: в текущей версии вызывается событие seriesClick
Вполне вероятно, что вам они уже хорошо подходят.
Что касается расцветки, у нас из коробки три палитры — больше решили пока не делать; зато сделали всё, чтобы задать свою палитру можно было максимально просто.
По вопросу о кликах на элементы легенды: в текущей версии вызывается событие seriesClick
Спасибо, это событие различает именно клик на легенду и клик на элементы графика?
Есть у меня задачка такая, разные действия совершать нужно, гугл такого не умеет :(
Есть у меня задачка такая, разные действия совершать нужно, гугл такого не умеет :(
К сожалению, сейчас — не умеет.
Есть такая идея, добавить событие legendClick, но пока запросов на него не было. Теперь есть, теперь будем думать :)
Сейчас обрабатываются pointClick, seriesClick (для Line-серии — щелчок по непосредственно линии), argumentAxisClick — щелчок по подписи к оси. Ну и события на hover.
Есть такая идея, добавить событие legendClick, но пока запросов на него не было. Теперь есть, теперь будем думать :)
Сейчас обрабатываются pointClick, seriesClick (для Line-серии — щелчок по непосредственно линии), argumentAxisClick — щелчок по подписи к оси. Ну и события на hover.
НЛО прилетело и опубликовало эту надпись здесь
Несколько вопросов:
1. Можно ли построить нормальный, координатный график по данным
[{0:1},{2:4},{4:2}] и [{1:1},{2,5:9},{3.7:56}]
2. Можно нарисовать на графике вертикальную линию с определенной координатой и определенной же подписью?
3. Можно ставить метки на координаты без наведения мыши?
Хочу получить такое:
1. Можно ли построить нормальный, координатный график по данным
[{0:1},{2:4},{4:2}] и [{1:1},{2,5:9},{3.7:56}]
2. Можно нарисовать на графике вертикальную линию с определенной координатой и определенной же подписью?
3. Можно ставить метки на координаты без наведения мыши?
Хочу получить такое:
highcharts и highstock вам в помощь
1) не совсем понял вопрос — мы говорим про парсинг строки? Если да, то, к сожалению, такого нет. Если про построение графика по координатам, пришедшим в виде численного массива — то есть, это же основная функциональность.
2) В текущей версии (13.1.5) это не реализовано. Есть в планах.
3) Можно, опция labels.
График для данных координат. Хотя мы всё же рекомендуем отдавать данные через единый dataSource.
2) В текущей версии (13.1.5) это не реализовано. Есть в планах.
3) Можно, опция labels.
График для данных координат. Хотя мы всё же рекомендуем отдавать данные через единый dataSource.
Графики неплохие, на первый взгляд. Только вот ни слова о производительности чартов: сколько точек поддерживается разом, поддерживается ли добавление точек «на ходу»?
Я могу с ходу назвать довольно много тем, которых я не коснулся. И так уж больно статья объемная получилась :)
Надеюсь со временем исправиться.
Касательно производительности: 2000 точек мы держим без ущерба для производительности на большинстве современных систем. Держим и больше. Но.
Как правило, показывать больше точек, чем у вас пикселей по горизонтали — занятие довольно неблагодарное.
Отсюда вывод — мы рекомендуем фильтровать точки с помощью алгоритмов фильтрации, например, медианной фильтрации. У нас есть рабочее решение с использованием фильтра (оформляем как пример), рассматриваем возможность добавить этот фильтр внутрь чартов.
Касательно добавления точек «на ходу» — при замене источника данных чарт перерисовывается. Анимация перерисовки (опускающиеся бары) в данный момент не производится.
Это как раз используется в решении на основе виртурилки, на которое я ссылался в статье.
Надеюсь со временем исправиться.
Касательно производительности: 2000 точек мы держим без ущерба для производительности на большинстве современных систем. Держим и больше. Но.
Как правило, показывать больше точек, чем у вас пикселей по горизонтали — занятие довольно неблагодарное.
Отсюда вывод — мы рекомендуем фильтровать точки с помощью алгоритмов фильтрации, например, медианной фильтрации. У нас есть рабочее решение с использованием фильтра (оформляем как пример), рассматриваем возможность добавить этот фильтр внутрь чартов.
Касательно добавления точек «на ходу» — при замене источника данных чарт перерисовывается. Анимация перерисовки (опускающиеся бары) в данный момент не производится.
Это как раз используется в решении на основе виртурилки, на которое я ссылался в статье.
Нашел пример ну очень грубой фильтрации случайно нагенеренных данных:
jsfiddle.net/kaatula/NLfFE/2/
В первом случае 5000 точек, во втором — 500. Первый график, наверно, точнее. Но можно ли назвать его читабельным?
jsfiddle.net/kaatula/NLfFE/2/
В первом случае 5000 точек, во втором — 500. Первый график, наверно, точнее. Но можно ли назвать его читабельным?
Выглядит действительно здорово, но… 481кб… Тот же highcharts умещается в 122 килобайта.
Очень многие, кому надо отрисовать лишь пару несложных графиков, выберут что-то другое, полегче.
Очень многие, кому надо отрисовать лишь пару несложных графиков, выберут что-то другое, полегче.
Мы работаем над этим (с)
Это не шутка, это один из основных вопросов следующей итерации. Мы рассматриваем возможности изменения организации исходного кода для лучшей минимизации. Получится ли что-нибудь из этого — покажет время.
Пока мы лежим на CDN, кэшируемся. То есть наступаем по другим фронтам.
Упомянутая вами библиотека умещается в 131 килобайт (проверил последнюю версию) для всех графиков, кроме финансовых. Которые ещё 162 кб.
Это не шутка, это один из основных вопросов следующей итерации. Мы рассматриваем возможности изменения организации исходного кода для лучшей минимизации. Получится ли что-нибудь из этого — покажет время.
Пока мы лежим на CDN, кэшируемся. То есть наступаем по другим фронтам.
Упомянутая вами библиотека умещается в 131 килобайт (проверил последнюю версию) для всех графиков, кроме финансовых. Которые ещё 162 кб.
Спасибо за статью. Думаю, в начало неплохо было бы добавить какие форматы входных данных поддерживаются, только JSON или ещё что-то. И, если можно, расскажите поподробнее про штриховку, она доступна только для элемента
rect или более сложные формы тоже можно штриховкой закрасить?Форматы входных данных:
— поддерживается JSON;
— в комплекте идёт модуль для интеграции с OData-поставщиками данных.
XML не поддерживаем, т.к. большинство современных сервисов способны отдавать данные в JSON.
Если есть какие-то проблемы — стараемся помочь людям её решить.
Касательно штриховки:
Area-серии штрихуются, круговые диаграммы штрихуются…
По умолчанию штриховка включается только на selection:
В примерах в статье я руками включал штриховку на hovered
— поддерживается JSON;
— в комплекте идёт модуль для интеграции с OData-поставщиками данных.
XML не поддерживаем, т.к. большинство современных сервисов способны отдавать данные в JSON.
Если есть какие-то проблемы — стараемся помочь людям её решить.
Касательно штриховки:
Area-серии штрихуются, круговые диаграммы штрихуются…
По умолчанию штриховка включается только на selection:
pointClick: function(point) {
point.select();
},
В примерах в статье я руками включал штриховку на hovered
Спасибо!!!
А чем ваш проект отличается от http://www.chartjs.org/? Названия вроде одинаковые, функционал похож… К тому же денег не берут.
Тот же вопрос, но насчет d3js.org/
D3js — прекрасный проект для визуализации данных. Без шуток. Но весьма низкоуровневый.
Для создания достаточно банальных графиков необходимо обладать недюжинными познаниями в нескольких смежных областях знания.
Наш же продукт ориентирован на то, что вы сможете за 10-15 минут сделать график, а всё остальное время решать свои проблемы в приложениях.
Для создания достаточно банальных графиков необходимо обладать недюжинными познаниями в нескольких смежных областях знания.
Наш же продукт ориентирован на то, что вы сможете за 10-15 минут сделать график, а всё остальное время решать свои проблемы в приложениях.
А чуть шаг в сторону — и придётся решать проблемы, разбирая и дополняя код ChartJS?
Смотря куда шагать.
Если шагать в направлении, которое нужно вам одному, и вот только вот вам одному — я полагаю, что да.
По просьбе саппортистов команда разработчиков может посмотреть проблему, оценить, решаема ли она в принципе, и выдать азимут, по которому нужно копать.
Если шагать в направлении, на которое мы посмотрим, хлопнем себя по лбу и скажем — ёлки-палки, как же мы без этого зарелизились! — тогда будет подключаться основная команда, и, весьма вероятно, дополнения войдут в следующий мажор.
Это, кстати, сценарий с ненулевой вероятностью.
Если шагать в направлении, которое нужно вам одному, и вот только вот вам одному — я полагаю, что да.
По просьбе саппортистов команда разработчиков может посмотреть проблему, оценить, решаема ли она в принципе, и выдать азимут, по которому нужно копать.
Если шагать в направлении, на которое мы посмотрим, хлопнем себя по лбу и скажем — ёлки-палки, как же мы без этого зарелизились! — тогда будет подключаться основная команда, и, весьма вероятно, дополнения войдут в следующий мажор.
Это, кстати, сценарий с ненулевой вероятностью.
Все чарты друг на друга похожи. Только одни прямоугольные, а другие круглые.
Дьявол, как правило, в деталях :) А к деталям мы стараемся быть очень внимательными…
Вопрос же ваш очень хорош.
Действительно, есть две библиотеки с похожими именами — наш ChartJS и опенсурсный Chart.js.
Библиотеки появились почти в одно и то же время, но на публике Chart.js стал известен раньше.
Наш продукт предоставляет значительно больше типов графиков, гейджи, range selector.
Технически chart.js построен на canvas, мы — на SVG.
Про деньги — денег с некоммерческого использования мы также не берем.
А с коммерческого — отрабатываем. В DevExpress служба поддержки, широко известная за пределами компании. Причем в хорошем смысле :)
Дьявол, как правило, в деталях :) А к деталям мы стараемся быть очень внимательными…
Вопрос же ваш очень хорош.
Действительно, есть две библиотеки с похожими именами — наш ChartJS и опенсурсный Chart.js.
Библиотеки появились почти в одно и то же время, но на публике Chart.js стал известен раньше.
Наш продукт предоставляет значительно больше типов графиков, гейджи, range selector.
Технически chart.js построен на canvas, мы — на SVG.
Про деньги — денег с некоммерческого использования мы также не берем.
А с коммерческого — отрабатываем. В DevExpress служба поддержки, широко известная за пределами компании. Причем в хорошем смысле :)
Спасибо за развернутый ответ =) Именно то что мне и хотелось услышать!
> Не все библиотеки чартов одинаково полезны
Спасибо, что поддержали меня в донесении этой мысли )
> Не думаю, что такое или такое можно быстро сделать на чём-то ещё, кроме d3js.
Когда мы говорим о «быстро», мы какой временной интервал подразумеваем? ;) Я не хочу показаться некомпетентным, но я минут за 20 это не напишу. И за 30 не напишу.
И более того, очень часто мне это и не надо будет. Сделать «ааааах» — это одна задача.
Сделать так, чтобы было при взгляде на картинку человеку стало что-то понятно и его постигло озарение — другая. ChartJS решают именно её. А приведенные вами примеры — нет. Потому что у них задача другая )
Спасибо, что поддержали меня в донесении этой мысли )
> Не думаю, что такое или такое можно быстро сделать на чём-то ещё, кроме d3js.
Когда мы говорим о «быстро», мы какой временной интервал подразумеваем? ;) Я не хочу показаться некомпетентным, но я минут за 20 это не напишу. И за 30 не напишу.
И более того, очень часто мне это и не надо будет. Сделать «ааааах» — это одна задача.
Сделать так, чтобы было при взгляде на картинку человеку стало что-то понятно и его постигло озарение — другая. ChartJS решают именно её. А приведенные вами примеры — нет. Потому что у них задача другая )
кстати, забыл добавить тогда, пишу сейчас (не слоупок) возможно почерпнете идеи отсюда
Подскажите, а есть ли у вас у вас функционал, котрый у FusionCharts называется Error Charts?
Его Demo можно найти в PowerCharts XT — Error Charts.
Его Demo можно найти в PowerCharts XT — Error Charts.
Возможно ли на одном чарте совместить графики в разных масштабах?
Есть например чарт с 4 графиками, на одном из периодически появляются пики, которые сильно меняют масштаб всего чарта, т.е. оставшиеся 3 графика становятся нечитаемыми. Хотелось бы для него задать свою шкалу (справа) и соответственно чтобы он не влиял на масштаб других 3-х.
Есть например чарт с 4 графиками, на одном из периодически появляются пики, которые сильно меняют масштаб всего чарта, т.е. оставшиеся 3 графика становятся нечитаемыми. Хотелось бы для него задать свою шкалу (справа) и соответственно чтобы он не влиял на масштаб других 3-х.
Зарегистрируйтесь на Хабре, чтобы оставить комментарий
ChartJS — JavaScript-библиотека визуализации данных