Производительность линейных графиков

Question

Я пытаюсь получить максимальную производительность для моих линейных графиков с LightningChart JS. Из примера производительности я узнал, что максимальное количество баллов, которое я могу запустить с помощью тестера производительности , составляет 10 серий x 1 миллион очков каждый. Я настраиваю это так .

Я могу запустить его с 30-40 обновлениями в секунду. Два вопроса:

1. Есть ли простой способ проверить это с большим количеством очков? Любая онлайн-демонстрация / тестер для этого?
2. Существуют ли общие рекомендации по оптимизации настроек производительности с помощью этой JavaScript диаграммы молнии?

Answer 1

Тестирование с большим количеством баллов

В настоящее время нет онлайн-тестера с таким количеством очков. Но исходный код используемого вами тестера доступен в GitHub: https://github.com/Arction/lcjs-performance-tester В репозитории есть хорошие инструкции по его локальному запуску.

Чтобы добавить тест с большим количеством баллов, вы можете отредактируйте файл content/src/tests/default.js и добавьте новый тест, в котором есть количество баллов, которое вы хотите проверить. Допустим, вы хотели бы иметь 10 серий по 2 миллиона очков в каждой. Вы можете добавить

{
    key: '2M',
    label: '2 M points',
    code: (thickness) => ScrollingProgressiveLine(2 * 1000 * 1000, seriesCount, thickness.thickness, `${seriesCount} Scrolling Line Series 2 000 000 points each ${thickness.label}`),
    defaultSelected: false
},

после строки 718, между тестами 1М и 10М. Последний тест в этом списке исключается из фактического выполнения работоспособного теста.

Существует также демонстрационный пример, который можно использовать, чтобы увидеть, сколько точек может отображать диаграмма при сохранении 60 кадров в секунду. https://arction.github.io/lcjs-showcase-streamingData/

Оптимизация производительности

1. Установка DataPattern на основе данных, которые вы используете при создании новой серии.
   • Для ряда линий это установлено с помощью свойства dataPattern в опциях ряда линий. chart.addLineSeries({dataPattern: DataPatterns.horizontalProgressive})
2. Отключить анимацию.
   • Я уже ответил, как отключить анимацию в Как отключить анимацию для диаграмм в LightningChart JS? .
3. Отключить взаимодействие с мышью.
   • Чтобы отключить взаимодействие с мышью, вы можете вызвать .setMouseInteractions (false) по всем осям, сериям и диаграммам.
4. Отключить автоматический курсор.
   • Для этого необходимо установить AutoCursorMode с AutoCursorModes.disabled в качестве параметра.