如何将 uielement 文本框对齐到使用 lineseries 制作的行上方

Question

我正在使用 LightningChartJs 并添加了一个 UIElement 文本框，我想将它放在线条上方，但是当我将线条的比例赋予 addUIElement 时，它没有显示。

chart.addUIElement(UIElementBuilders.TextBox,myseries.scale).setText('test')

Answer 1

当您使用另一个系列的比例尺时，UIElement 的定位是使用该系列的坐标完成的。默认情况下，UIElement 将定位到 0,0 坐标。如果您的线系列不显示此坐标，则 UIElement 将不在视图中。

因此，如果您有一条从 10,10 到 20,20 的线并且您没有设置 UIElement 的位置，那么您很可能看不到 UIElement，因为它位于 0,0 位置。在这种情况下，您应该将 UIElement 的位置设置为 10,10-20,20 范围内的某个值。 uiElement.setPosition({x: 12, y:12 })

有关工作示例，请参阅下面的代码片段。

const {
    lightningChart,
    UIElementBuilders
} = lcjs

const chart = lightningChart().ChartXY()

const series = chart.addLineSeries()

series.addArrayY([1, 2, 1, 3, 2, 2, 3, 2, 1])

// add text box on the chart, using series scale
const textOverLine = chart.addUIElement(UIElementBuilders.TextBox, series.scale)
    .setText('My Text')
    // position the text, this is in the line series coordinates
    .setPosition({ x: 4.5, y: 2.1 })

<script src="https://unpkg.com/@arction/lcjs@1.3.1/dist/lcjs.iife.js"></script>

如何将 uielement 文本框对齐到使用 lineseries 制作的行上方

How to align uielement textbox above a line made using lineseries

javascript

lightningchart