Skip to content

Commit

Permalink
opt: opt render
Browse files Browse the repository at this point in the history
  • Loading branch information
@liihuu
liihuu committed Jun 4, 2024
1 parent 635c8d3 commit 9efcd01
Show file tree
Hide file tree
Showing 3 changed files with 36 additions and 23 deletions.
21 changes: 13 additions & 8 deletions src/extension/figure/rect.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -62,10 +62,8 @@ export function drawRect (ctx: CanvasRenderingContext2D, attrs: RectAttrs | Rect
} = styles
// eslint-disable-next-line @typescript-eslint/unbound-method
const draw = ctx.roundRect ?? ctx.rect
if (
(style === PolygonType.Fill || styles.style === PolygonType.StrokeFill) &&
(!isString(color) || !isTransparent(color))
) {
const solid = (style === PolygonType.Fill || styles.style === PolygonType.StrokeFill) && (!isString(color) || !isTransparent(color))
if (solid) {
ctx.fillStyle = color
rects.forEach(({ x, y, width: w, height: h }) => {
ctx.beginPath()
Expand All @@ -76,6 +74,7 @@ export function drawRect (ctx: CanvasRenderingContext2D, attrs: RectAttrs | Rect
}
if ((style === PolygonType.Stroke || styles.style === PolygonType.StrokeFill) && borderSize > 0 && !isTransparent(borderColor)) {
ctx.strokeStyle = borderColor
ctx.fillStyle = borderColor
ctx.lineWidth = borderSize
if (borderStyle === LineType.Dashed) {
ctx.setLineDash(borderDashedValue)
Expand All @@ -85,10 +84,16 @@ export function drawRect (ctx: CanvasRenderingContext2D, attrs: RectAttrs | Rect
const correction = borderSize % 2 === 1 ? 0.5 : 0
const doubleCorrection = Math.round(correction * 2)
rects.forEach(({ x, y, width: w, height: h }) => {
ctx.beginPath()
draw.call(ctx, x + correction, y + correction, w - doubleCorrection, h - doubleCorrection, r)
ctx.closePath()
ctx.stroke()
if (w > borderSize * 2 && h > borderSize * 2) {
ctx.beginPath()
draw.call(ctx, x + correction, y + correction, w - doubleCorrection, h - doubleCorrection, r)
ctx.closePath()
ctx.stroke()
} else {
if (!solid) {
ctx.fillRect(x, y, w, h)
}
}
})
}
}
Expand Down
20 changes: 13 additions & 7 deletions src/store/TimeScaleStore.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -124,13 +124,19 @@ export default class TimeScaleStore {
}

private _calcGapBarSpace (): number {
const rateSpace = Math.floor(this._barSpace * 0.86)
const floorSpace = Math.floor(this._barSpace)
const optimalSpace = Math.min(rateSpace, floorSpace - 1)
let gapBarSpace = Math.max(1, optimalSpace)
if (gapBarSpace > 2 && gapBarSpace % 2 === 1) {
let gapBarSpace: number
if (this._barSpace > 3) {
gapBarSpace = Math.floor(this._barSpace * 0.88)
} else {
gapBarSpace = Math.floor(this._barSpace)
if (gapBarSpace === this._barSpace) {
gapBarSpace--
}
}
if (gapBarSpace % 2 === 0) {
gapBarSpace--
}
gapBarSpace = Math.max(1, gapBarSpace)
return gapBarSpace
}

Expand Down Expand Up @@ -238,7 +244,7 @@ export default class TimeScaleStore {
bar: this._barSpace,
halfBar: this._barSpace / 2,
gapBar: this._gapBarSpace,
halfGapBar: this._gapBarSpace / 2
halfGapBar: Math.floor(this._gapBarSpace / 2)
}
}

Expand Down Expand Up @@ -367,7 +373,7 @@ export default class TimeScaleStore {
const dataCount = this._chartStore.getDataList().length
const deltaFromRight = dataCount + this._lastBarRightSideDiffBarCount - dataIndex
// return Math.floor(this._totalBarSpace - (deltaFromRight - 0.5) * this._barSpace) - 0.5
return Math.floor(this._totalBarSpace - (deltaFromRight - 0.5) * this._barSpace + 0.5)
return Math.floor(this._totalBarSpace - (deltaFromRight - 0.5) * this._barSpace)
}

coordinateToDataIndex (x: number): number {
Expand Down
18 changes: 10 additions & 8 deletions src/view/CandleBarView.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,12 +47,14 @@ export default class CandleBarView extends ChildrenView {
const candleBarOptions = this.getCandleBarOptions(chartStore)
if (candleBarOptions !== null) {
let ohlcSize = 0
let halfOhlcSize = 0
if (candleBarOptions.type === CandleType.Ohlc) {
const { gapBar } = chartStore.getTimeScaleStore().getBarSpace()
ohlcSize = Math.min(Math.max(Math.round(gapBar * 0.2), 1), 8)
if (ohlcSize > 2 && ohlcSize % 2 === 1) {
ohlcSize--
}
halfOhlcSize = Math.floor(halfOhlcSize / 2)
}
const yAxis = pane.getAxisComponent()
this.eachChildren((data, barSpace) => {
Expand Down Expand Up @@ -115,21 +117,21 @@ export default class CandleBarView extends ChildrenView {
name: 'rect',
attrs: [
{
x: x - ohlcSize / 2,
x: x - halfOhlcSize,
y: priceY[0],
width: ohlcSize,
height: priceY[3] - priceY[0]
},
{
x: x - barSpace.halfGapBar,
y: openY + ohlcSize > priceY[3] ? priceY[3] - ohlcSize : openY,
width: barSpace.halfGapBar - ohlcSize / 2,
width: barSpace.halfGapBar,
height: ohlcSize
},
{
x: x + ohlcSize / 2,
x: x + halfOhlcSize,
y: closeY + ohlcSize > priceY[3] ? priceY[3] - ohlcSize : closeY,
width: barSpace.halfGapBar - ohlcSize / 2,
width: barSpace.halfGapBar - halfOhlcSize,
height: ohlcSize
}
],
Expand Down Expand Up @@ -176,9 +178,9 @@ export default class CandleBarView extends ChildrenView {
{
name: 'rect',
attrs: {
x: x - barSpace.halfGapBar + 1,
x: x - barSpace.halfGapBar,
y: priceY[1],
width: barSpace.gapBar - 1,
width: barSpace.gapBar,
height: Math.max(1, priceY[2] - priceY[1])
},
styles: {
Expand Down Expand Up @@ -213,9 +215,9 @@ export default class CandleBarView extends ChildrenView {
{
name: 'rect',
attrs: {
x: x - barSpace.halfGapBar + 1,
x: x - barSpace.halfGapBar,
y: priceY[1],
width: barSpace.gapBar - 1,
width: barSpace.gapBar,
height: Math.max(1, priceY[2] - priceY[1])
},
styles: {
Expand Down

0 comments on commit 9efcd01

Please sign in to comment.