Добрый день.
Вопрос 1)
График (line chart) строится на основе массива в котором ~30000 элементов.(Ось X - даты, Y - значения )
В начале я прохожусь циклом, чтобы найти максимальное значение по оси Y, затем циклом для отрисовки осей и значений на них, а затем еще одним циклом для того, чтобы нарисовать сам график.
Как можно оптимизировать эти 3 цикла, чтобы страница не подвисала на несколько секунд, как это происходит сейчас ?
Вопрос 2)
В данных на основании которых строится график, значения, используемые для оси Y могут повторятся. Т.к массив данных большой, я хочу отображать на оси Y, например не больше 20 значений. Как правильно выбрать уникальные значения, для отображение по Y ?
Может я чето не правильно понял, но вот мой вариант решения. Тоесть мы можем просматривать график, рисуем только его часть. Для теста также забил массив на 30к элементов, ничего не лагает все норм пробовал даже лям, впринципе любое значение будет норм так как он работает только с несколькими без перебора всего массива.
спасибо. По оси Y могут быть также и отрицательные значения и если нужно чтобы верхняя и нижняя границы на графике были реальными все равно придется перебирать все значения циклом ?
mortyy, Ну чтобы узнать макс и мин значение 1 раз придется перебрать массив. Но к примеру если этот массив дает пхп сервер, то можно сделать это и на сервере, если он вытягивается из бд то можно скинуть чтобы бд нашла эти значения. А можно вообще их где то в бд хранить, при добавление смотреть если значение больше максимального заменять и т.д.
. Он сам найдет минимальное, максимальное и построит график. Работает быстро, с учетом того что генерирует этот массив, а потом проходит по нему, все происходит мгновенно по крайней мере для 30000 элементов.
А почему канвас? На svg как правило все намного проще, особенно если нужна какая-то интерактивность. Если хочется уже готовое - смотреть в сторону того, что посоветовал JRK_DV, если хочется писать свое - то d3.js
графики с большим количеством данных вообще трудно делать, при каком-то размере датасета любой подход перестаёт работать.
конкретно насчёт скорости простой отрисовки, главное - не перекрашивать одни и те же пикселы много раз. если у вас, конечно, не 30 тысяч пикселов в ширину график, то на одну колонку пикселов у вас рисуется много отсчётов. поэтому можно отобрать данные, которые попадают в эту группу, взять из них минимум и максимум (если диапазон не касается прошлого - растянуть до его границы) и отрисовать одной линией.