翻譯|使用教程|編輯:吳園園|2020-04-08 16:36:58.593|閱讀 290 次
概述:此示例顯示了使用OHLC系列的OHLC圖表的基本實(shí)現(xiàn)。
# 界面/圖表報(bào)表/文檔/IDE等千款熱門軟控件火熱銷售中 >>
相關(guān)鏈接:
LightningChart JS是Web上性能最高的圖表庫(kù)具有出色的執(zhí)行性能 - 使用高數(shù)據(jù)速率同時(shí)監(jiān)控?cái)?shù)十個(gè)數(shù)據(jù)源。 GPU加速和WebGL渲染確保您的設(shè)備的圖形處理器得到有效利用,從而實(shí)現(xiàn)高刷新率和流暢的動(dòng)畫。非常適合用于貿(mào)易,工程,航空航天,醫(yī)藥和其他領(lǐng)域的應(yīng)用。
點(diǎn)擊下載LightningChart JS最新試用版

OHLC圖表
此示例顯示了使用OHLC系列的OHLC圖表的基本實(shí)現(xiàn)。
// OHLCSeries exists inside XY-charts.
const chart = lightningChart().ChartXY()
const ohlcSeries = chart.addOHLCSeries(
// Specify type of figure used
{ positiveFigure: OHLCFigures.Bar }
)
OHLC系列接受接口“ XOHLC”形式的數(shù)據(jù):
const xohlc = [
// X-position
0,
// Opening Y-value
100,
// Highest Y-value
200,
// Lowest Y-value
50,
// Closing Y-value
75
]
// Add new segment to series.
ohlcSeries.add(xohlc)
add() 可以用單個(gè)XOHLC對(duì)象或它們的數(shù)組調(diào)用。
條形圖的解剖
條形圖由三個(gè)線段組成,可以使用單個(gè)LineStyle對(duì)象設(shè)置樣式。
圖形樣式
OHLC系列提供了分別指定正和負(fù)燭臺(tái)樣式的功能。
// Width of both positive and negative candlesticks
const figureWidth = 5.0
// Green color filling
const fillStylePositive = new SolidFill()
.setColor( ColorRGBA( 0, 128, 0 ) )
// Lime color filling
const fillStyleHighlightPositive = new SolidFill()
.setColor( ColorRGBA (0, 255, 0) )
// Black color stroke
const bodyStrokeStyle = new SolidLine()
.setFillStyle( new SolidFill().setColor( ColorRGBA( 0, 0, 0 ) ) )
.setThickness( 1.0 )
// Green color stroke
const strokeStylePositive = new SolidLine()
.setFillStyle( new SolidFill().setColor( ColorRGBA( 0, 128, 0 ) ) )
// Lime color stroke
const strokeStylePositiveHighlight = new SolidLine()
.setFillStyle( new SolidFill().setColor( ColorRGBA( 0, 240, 0 ) ) )
ohlcSeries
// Setting width of figures
.setFigureWidth ( figureWidth )
// Styling positive candlestick
.setPositiveStyle ( ( candlestick ) => candlestick
// Candlestick body fill style
.setBodyFillStyle( fillStylePositive )
// Candlestick body fill style when highlighted
.setBodyFillStyleHighlight( fillStyleHighlightPositive )
// Candlestick body stroke style
.setBodyStrokeStyle( bodyStrokeStyle )
// Candlestick stroke style
.setStrokeStyle( strokeStylePositive )
// Candlestick stroke style when highlighted
.setStrokeStyleHighlight( strokeStylePositiveHighlight )
)
// Styling negative candlestick
.setNegativeStyle( ( candlestick ) => candlestick
// etc ...
)
=====================================================
如果你想LightningChart JS應(yīng)用于商業(yè)用途,歡迎。
關(guān)注下方的微信公眾號(hào),及時(shí)獲取產(chǎn)品最新資訊▼▼▼
本站文章除注明轉(zhuǎn)載外,均為本站原創(chuàng)或翻譯。歡迎任何形式的轉(zhuǎn)載,但請(qǐng)務(wù)必注明出處、不得修改原文相關(guān)鏈接,如果存在內(nèi)容上的異議請(qǐng)郵件反饋至chenjj@ke049m.cn
文章轉(zhuǎn)載自: