tencent cloud

PrevNext

文档反馈

请输入关键字

Recent Pages

文档
腾讯云小程序平台
    文档
    Download PDF

    Path2D

    最后更新时间：2024-07-12 19:25:10
    下载PDF
      功能说明：Canvas 2D API 的接口 Path2D 用来声明路径，此路径稍后会被 CanvasRenderingContext2D 对象使用。CanvasRenderingContext2D 接口的 路径方法也存在于 Path2D 这个接口中，允许您在 Canvas 中根据需要创建可以保留并重用的路径。

      属性

      属性
      类型
      说明
      width
      number
      使用像素描述 ImageData 的实际宽度
      height
      number
      使用像素描述 ImageData 的实际高度
      data
      Uint8ClampedArray
      一维数组，包含以 RGBA 顺序的数据，数据使用 0 至 255（包含）的整数表示
      

      方法集

      addPath

      该 方法 使用方式为 Path2D.addPath(Path2D path)
      功能说明：添加路径到当前路径。
      参数及说明：Path2D path，添加的 Path2D 路径。

      arc

      该 方法 使用方式为 Path2D.arc(number x, number y, number radius, number startAngle, number endAngle, boolean counterclockwise)
      功能说明：添加一段圆弧路径。
      参数及说明：
      number x：圆心横坐标。
      number y：圆心纵坐标。
      number radius：圆形半径，必须为正数。
      number startAngle：圆弧开始角度。
      number endAngle：圆弧结束角度。
      boolean counterclockwise：是否逆时针绘制。如果传 true, 则会从 endAngle 开始绘制到 startAngle。

      arcTo

      该 方法 使用方式为 Path2D.arcTo(number x1, number y1, number x2, number y2, number radius)
      功能说明：通过给定控制点添加一段圆弧路径。
      参数及说明：
      number x1：第一个控制点横坐标。
      number y1：第一个控制点纵坐标。
      number x2：第二个控制点横坐标。
      number y2：第二个控制点纵坐标。
      number radius：圆形半径，必须为非负数。

      bezierCurveTo

      该 方法 使用方式为 Path2D.bezierCurveTo(number cp1x, number cp1y, number cp2x, number cp2y, number x, number y)
      功能说明：添加三次贝塞尔曲线路径。
      参数及说明：
      number cp1x：第一个控制点横坐标。
      number cp1y：第一个控制点纵坐标。
      number cp2x：第二个控制点横坐标。
      number cp2y：第二个控制点纵坐标。
      number x：结束点横坐标。
      number y：结束点纵坐标。

      closePath

      该 方法 使用方式为 Path2D.closePath()
      功能说明：闭合路径到起点。

      ellipse

      该 方法 使用方式为 Path2D.ellipse(number x, number y, number radiusX, number radiusY, number rotation, number startAngle, number endAngle, boolean counterclockwise)
      功能说明：添加椭圆弧路径。
      参数及说明：
      number x：椭圆圆心横坐标。
      number y：椭圆圆心纵坐标。
      number radiusX：椭圆长轴半径，必须为非负数。
      number radiusY：椭圆短轴半径，必须为非负数。
      number rotation：椭圆旋转角度。
      number startAngle：圆弧开始角度。
      number endAngle：圆弧结束角度。
      boolean counterclockwise：是否逆时针绘制。如果传 true, 则会从 endAngle 开始绘制到 startAngle。

      lineTo

      该 方法 使用方式为 Path2D.lineTo(number x, number y)
      功能说明：添加直线路径。
      参数及说明：
      number x：结束点横坐标。
      number y：结束点纵坐标。

      moveTo

      该 方法 使用方式为 Path2D.moveTo(number x, number y)
      功能说明：移动路径开始点。
      参数及说明：
      number x：横坐标。
      number y：纵坐标。

      quadraticCurveTo

      该 方法 使用方式为 Path2D.quadraticCurveTo(number cpx, number cpy, number x, number y)
      功能说明：添加二次贝塞尔曲线路径。
      参数及说明：
      number cpx：控制点横坐标。
      number cpy：控制点纵坐标。
      number x：结束点横坐标。
      number y：结束点纵坐标。

      rect

      该 方法 使用方式为 Path2D.rect(number x, number y, number width, number height)
      功能说明：添加方形路径。
      参数及说明：
      number x：开始点横坐标。
      number y：开始点纵坐标。
      number width：方形宽度，正数向右，负数向左。
      number height：方形高度，正数向下，负数向上。
      
      联系我们

      联系我们，为您的业务提供专属服务。

      联系我们
      技术支持

      如果你想寻求进一步的帮助，通过工单与我们进行联络。我们提供7x24的工单服务。

      提交工单
      7x24 电话支持
      Copyright © 2013-2024 Tencent Cloud. All Rights Reserved.
      隐私条款服务条款缓存条款