Динамическое изменение размера и формы точечной диаграммы — LightningChart JS

Как динамически изменять размер и форму точечной диаграммы при добавлении данных в серию

const pointz = chart.addPointSeries({ pointShape: PointShape.Circle })
    .setName('Kuopio')
    .setPointFillStyle(fillStyles[0])
    .setPointSize(pointSize)
    .setMaxPointCount(10000);

Я знаю, что мы можем динамически менять цвет,

const fillStyle = new IndividualPointFill({ color: ColorHSV(0) })

Есть ли способ динамически изменять размер, например серию ellipse?

введите здесь описание изображения


javascript lightningchart
person Gracie williams    schedule 28.05.2020    source источник

Ответы (1)


arrow_upward
4
arrow_downward

Lightning Chart JS v2.0.0 или выше

Размер точки и поворот можно задать индивидуально для каждой точки. Чтобы включить поддержку индивидуального размера или поворота, вызовите series.setIndividualPointSizeEnabled(true) и/или series.setIndividualPointRotationEnabled(true)

const series = chart.addPointSeries({ pointShape: PointShape.Triangle })
    .setIndividualPointSizeEnabled(true)

Когда размер отдельной точки включен, размер точки можно установить, указав значение в поле size для каждой точки.

series.add([
    { x: 0, y: 0, size: 1 },
    { x: 1, y: 0, size: 5 },
    { x: 2, y: 0, size: 10 },
    { x: 3, y: 0, size: 15 },
    { x: 4, y: 0, size: 20 },
    { x: 5, y: 0, size: 25 },
])

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

const series = chart.addPointSeries({ pointShape: PointShape.Triangle })
    .setIndividualPointSizeEnabled(true)

series.add([
    { x: 0, y: 3, rotation: 0 },
    { x: 1, y: 3, rotation: Math.PI / 4 },
    { x: 2, y: 3, rotation: Math.PI / 2 },
    { x: 3, y: 3, rotation: Math.PI },
    { x: 4, y: 3, rotation: Math.PI * 3/2 },
    { x: 5, y: 3, rotation: Math.PI * 2 },
])

Индивидуальный размер точки и поворот также могут быть использованы одновременно.

const series = chart.addPointSeries({ pointShape: PointShape.Triangle })
    .setIndividualPointSizeEnabled(true)
    .setIndividualPointRotationEnabled(true)

series4.add([
    { x: 0, y: 3, size: 1, rotation: 0 },
    { x: 1, y: 3, size: 5, rotation: Math.PI / 4 },
    { x: 2, y: 3, size: 10, rotation: Math.PI / 2 },
    { x: 3, y: 3, size: 15, rotation: Math.PI },
    { x: 4, y: 3, size: 20, rotation: Math.PI * 3/2 },
    { x: 5, y: 3, size: 25, rotation: Math.PI * 2 },
])

Форма точки пока не может быть изменена индивидуально.

Молниеносная диаграмма JS v1.x:

В настоящее время LightningChart JS не поддерживает индивидуальное изменение формы или размера точки. Это функция, которую мы хотели бы разработать, но еще не решили, когда и будет ли она реализована.

В качестве обходного пути вы можете использовать несколько серий точек для разных форм. Таким образом, вы можете иметь одну серию для каждой формы точек (квадрат, треугольник, круг), а затем добавлять точки в разные серии на основе факторов, которые вы хотите использовать для определения формы. Я знаю, что это не оптимальное решение, но это единственное решение, о котором я могу думать прямо сейчас.

person Snekw    schedule 08.06.2020
comment
Привет, пожалуйста, проверьте мой вопрос с отредактированным изображением. Эта функция очень полезна, все другие библиотеки диаграмм предоставляют это, пожалуйста, добавьте эту функцию в будущую версию, моя просьба .. спасибо. - person Gracie williams; 08.06.2020
comment
Я хочу добавить эту функцию, но пока не могу ничего обещать. - person Snekw; 09.06.2020