HarmonyOS鸿蒙Next中addColorStop中offset小于0.29时对组件左上角锚点的1vp颜色取值产生影响

HarmonyOS鸿蒙Next中addColorStop中offset小于0.29时对组件左上角锚点的1vp颜色取值产生影响

根据官方文档对addColorStop中offset的解释：“设置渐变点距离起点的位置占总体长度的比例，范围为0到1。”

下面的代码中rgb(255, 255, 0)颜色对应的渐变点距离起点的位置应该>299*0.28≈83vp，即是从x=83vp开始颜色渐变的，不应该会影响到起点的颜色才对，可看日志是影响到了的。

如果就是会影响的话，那关于颜色选择器中的色彩条该咋做，那里是以六分之一为渐变点的？

@Entry
@Component
struct Test {
  // 渲染设置-抗锯齿
  private settings: RenderingContextSettings = new RenderingContextSettings(true)
  // 颜色面板-画布渲染上下文对象
  private colorPanelContext: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings)

  build() {
    Column() {
      Canvas(this.colorPanelContext)
        .onAreaChange((oldValue: Area, newValue: Area) => {
          this.drawCanvas()
        })
        .width(300)
        .height(200)
    }
    .width('100%')
    .height('100%')
    .justifyContent(FlexAlign.Center)
    .alignItems(HorizontalAlign.Center)
  }

  drawCanvas(bgColor = 'rgb(255, 0, 0)') {
    // 清空画布颜色
    this.colorPanelContext.clearRect(0, 0, 300, 200)
    // 绘制渐变色：横向的
    const gradWhite = this.colorPanelContext.createLinearGradient(0, 0, 299, 0)
    gradWhite.addColorStop(0, 'rgb(255, 0, 0)')
    gradWhite.addColorStop(1, 'rgb(255, 0, 0)')
    this.colorPanelContext.fillStyle = gradWhite
    this.colorPanelContext.fillRect(0, 0, 300, 200)
    let left = this.colorPanelContext.getImageData(0,0,1,1)
    let right = this.colorPanelContext.getImageData(299,0,1,1)
    console.log(`left = [${left.data}]`)
    console.log(`right = [${right.data}]`)
  }
}

https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V2/ts-components-canvas-canvasgradient-0000001478341177-V2#ZH-CN_TOPIC_0000001574248597__addcolorstop