@363045841yyt/klinechart-core 0.8.7 → 0.8.8

package/src/engine/renderers/yAxis.ts

@@ -1,11 +1,11 @@
 import type { RendererPlugin, RenderContext } from '../../plugin'
 import { RENDERER_PRIORITY, GLOBAL_PANE_ID } from '../../plugin'
 import { drawCrosshairPriceLabel, drawAxisPriceLabel } from '../../utils/kLineDraw/axis'
-import { drawScaleTicks } from '../renderers/Indicator/scale/indicator_scale'
 import { resolveThemeColors } from '../../tokens'
+import { getFont, setCanvasFont } from '../theme/fonts'
+import { roundToPhysicalPixel } from '../draw/pixelAlign'
 
 import type { KLineData } from '../../types/price'
-import type { ScaleType } from '../utils/tickPosition'
 
 /**
  * 创建 Y 轴渲染器插件
@@ -42,32 +42,28 @@ export function createYAxisRendererPlugin(options: {
 
       const isPercent = scaleType === 'percent' && pane.role === 'price'
 
-      if (pane.capabilities.showPriceAxisTicks) {
-        const tickValueMin = isPercent ? pane.yAxis.getDisplayPercentRange().minPct : displayRange.minPrice
-        const tickValueMax = isPercent ? pane.yAxis.getDisplayPercentRange().maxPct : displayRange.maxPrice
-        const formatLabel = isPercent
+      if (pane.capabilities.showPriceAxisTicks && context.yAxisTicks) {
+        targetCtx.clearRect(0, 0, axisWidth, pane.height)
+
+        const font = getFont(12)
+        setCanvasFont(targetCtx, font)
+        targetCtx.textBaseline = 'middle'
+        targetCtx.textAlign = 'center'
+        targetCtx.fillStyle = tokenColors.text.secondary
+
+        const format = isPercent
           ? (v: number) => {
               const sign = v >= 0 ? '+' : ''
               return sign + v.toFixed(2) + '%'
             }
-          : undefined
+          : (v: number) => v.toFixed(2)
 
-        drawScaleTicks({
-          tickColor: tokenColors.text.secondary,
-          ctx: targetCtx,
-          dpr,
-          axisWidth,
-          height: pane.height,
-          paddingTop: pane.yAxis.getPaddingTop(),
-          paddingBottom: pane.yAxis.getPaddingBottom(),
-          valueMin: tickValueMin,
-          valueMax: tickValueMax,
-          isMain: true,
-          decimals: 2,
-          hideEdgeTicks: false,
-          scaleType: isPercent ? 'percent' : scaleType,
-          formatLabel,
-        })
+        const textX = roundToPhysicalPixel(axisWidth / 2, dpr)
+
+        for (const tick of context.yAxisTicks) {
+          const displayValue = isPercent ? pane.yAxis.toPercent(tick.value) : tick.value
+          targetCtx.fillText(format(displayValue), textX, tick.y)
+        }
       }
 
       // 绘制价格范围带（先于标签，使标签覆盖在范围带之上）

package/src/engine/utils/tickPosition.ts

@@ -206,6 +206,40 @@ function generatePixelUniformPercentTicks(options: {
     return positions
 }
 
+/**
+ * 计算均匀像素 Y 位置的值（统一像素反算）
+ * 所有刻度类型都先确定像素均匀 Y 位置，再通过 yToPrice 反算该位置的值
+ */
+export interface UniformPixelTick {
+  y: number
+  value: number
+}
+
+/**
+ * 在给定 Y 像素位置，按指定刻度类型反算价格/值
+ */
+export function priceAtYForScaleType(
+  y: number,
+  valueMin: number,
+  valueMax: number,
+  scaleType: ScaleType,
+  height: number,
+  paddingTop: number,
+  paddingBottom: number,
+): number {
+  const viewH = Math.max(1, height - paddingTop - paddingBottom)
+  const ratio = 1 - (y - paddingTop) / viewH
+
+  if (scaleType === 'log') {
+    if (valueMin <= 0 || valueMax <= 0) return valueMin + ratio * (valueMax - valueMin)
+    const logMin = Math.log(valueMin)
+    const logMax = Math.log(valueMax)
+    return Math.exp(logMin + ratio * (logMax - logMin))
+  }
+
+  return valueMin + ratio * (valueMax - valueMin)
+}
+
 // calculateValueTickPositions 缓存
 let _cvtpCacheKey = ''
 let _cvtpCacheResult: TickPositionWithValue[] = []

package/src/engine/viewport/chartViewportManager.ts

@@ -95,16 +95,6 @@ export class ChartViewportManager {
     this._pendingScrollLeft = v
   }
 
-  /** 仅设置缓存 scrollLeft（由 DataManager 内部使用） */
-  setCachedScrollLeft(v: number): void {
-    this.cachedScrollLeft = v
-  }
-
-  /** 仅设置待写入 scrollLeft（由 DataManager 内部使用） */
-  setPendingScrollLeft(v: number): void {
-    this._pendingScrollLeft = v
-  }
-
   /** 在 RAF 回调中应用待写入的 scrollLeft */
   applyPendingScrollLeft(container: HTMLElement): void {
     if (this._pendingScrollLeft !== null) {
@@ -298,6 +288,11 @@ export class ChartViewportManager {
     this.observedSize.width = cssWidth
     this.observedSize.height = cssHeight
 
+    if (this.cachedScrollLeft === 0 && cssWidth > 0) {
+      this.cachedScrollLeft = cssWidth
+      this._pendingScrollLeft = cssWidth
+    }
+
     const pixelSize = entry.devicePixelContentBoxSize?.[0]
     const cssSize = entry.contentBoxSize?.[0]
     if (!pixelSize || !cssSize || cssSize.inlineSize <= 0) {

package/src/plugin/types.ts

@@ -262,6 +262,14 @@ export interface XAxisRange {
   opacity: number
 }
 
+/** Y轴刻度（位置+值），由 RenderContext 构建时预计算，所有 Y 轴渲染器共用 */
+export interface YAxisTick {
+  /** Y像素位置（相对 pane 顶部，逻辑像素） */
+  y: number
+  /** 该Y位置通过 pane.yAxis.yToPrice 反算的价格值 */
+  value: number
+}
+
 /** 渲染上下文 */
 /** MarkerManager 接口（用于 RenderContext） */
 export interface MarkerManagerLike {
@@ -328,6 +336,8 @@ export interface RenderContext {
   isAsiaMarket?: boolean
   /** 用户颜色预设覆盖项 */
   colorPresetSettings?: import('../tokens').ColorPresetSettings
+  /** 预计算的 Y 轴刻度列表（统一像素均匀分布 → yToPrice 反算），所有 Y 轴渲染器共用 */
+  yAxisTicks?: YAxisTick[]
 }
 
 export type DrawingAnchor = {

package/src/version.ts

@@ -1 +1 @@
-export const VERSION = "0.8.7"
+export const VERSION = "0.8.8"