@@ -292,7 +292,7 @@ <h2 id="什么时候用"><a class="heading-anchor" href="#什么时候用">#</a>
292292< div class ="table-scroll "> < table > < thead > < tr > < th > 目标</ th > < th > 首选 API</ th > < th > 说明</ th > </ tr > </ thead > < tbody > < tr > < td > 柱状、折线、面积、散点图</ td > < td > < code > Chart</ code > </ td > < td > 数据是字典列表,字段由 < code > x</ code > 、< code > y</ code > 、< code > series</ code > 指定。</ td > </ tr > < tr > < td > 简单 2D 绘图</ td > < td > < code > Canvas</ code > + < code > DrawingContext</ code > </ td > < td > 矩形、圆、线、文本、渐变、路径等命令。</ td > </ tr > < tr > < td > 自定义矢量形状</ td > < td > < code > Path</ code > </ td > < td > 三角形、曲线、弧线、可填充或描边的路径。</ td > </ tr > < tr > < td > 实时高频绘制</ td > < td > < code > Canvas</ code > + 稳定命令列表</ td > < td > 避免每次 < code > body()</ code > 重建大量命令。</ td > </ tr > </ tbody > </ table > </ div >
293293< h2 id ="chart "> < a class ="heading-anchor " href ="#chart "> #</ a > Chart</ h2 >
294294< p > < code > Chart(data=None, x='x', y='y', type='bar', color=None, series=None)</ code > </ p >
295- < div class ="table-scroll "> < table > < thead > < tr > < th > API</ th > < th > 签名</ th > < th > 分类</ th > </ tr > </ thead > < tbody > < tr > < td > < code > Chart</ code > </ td > < td > < code > Chart(data: Optional[List [Dict[str, Any]]] = None, x: str = 'x', y: str = 'y', type: str = 'bar', color: Optional[ColorLike] = None, series: Optional[str] = None)</ code > </ td > < td > < code > media</ code > </ td > </ tr > </ tbody > </ table > </ div >
295+ < div class ="table-scroll "> < table > < thead > < tr > < th > API</ th > < th > 签名</ th > < th > 分类</ th > </ tr > </ thead > < tbody > < tr > < td > < code > Chart</ code > </ td > < td > < code > Chart(data: Optional[Sequence [Dict[str, Any]]] = None, x: str = 'x', y: str = 'y', type: str = 'bar', color: Optional[ColorLike] = None, series: Optional[str] = None)</ code > </ td > < td > < code > media</ code > </ td > </ tr > </ tbody > </ table > </ div >
296296< figure class ="code-block " data-code-id ="3dddc8da4f9b ">
297297 < figcaption >
298298 < span > python</ span >
@@ -362,7 +362,7 @@ <h3 id="多序列示例"><a class="heading-anchor" href="#多序列示例">#</a>
362362</ figure >
363363< h2 id ="canvas "> < a class ="heading-anchor " href ="#canvas "> #</ a > Canvas</ h2 >
364364< p > < code > Canvas(width=300, height=300, commands=None, context=None)</ code > </ p >
365- < div class ="table-scroll "> < table > < thead > < tr > < th > API</ th > < th > 签名</ th > < th > 分类</ th > </ tr > </ thead > < tbody > < tr > < td > < code > Canvas</ code > </ td > < td > < code > Canvas(width: float = 300, height: float = 300, commands: Optional[List [Dict[str, Any]]] = None, context: Optional[DrawingContext] = None)</ code > </ td > < td > < code > drawing</ code > </ td > </ tr > </ tbody > </ table > </ div >
365+ < div class ="table-scroll "> < table > < thead > < tr > < th > API</ th > < th > 签名</ th > < th > 分类</ th > </ tr > </ thead > < tbody > < tr > < td > < code > Canvas</ code > </ td > < td > < code > Canvas(width: float = 300, height: float = 300, commands: Optional[Sequence [Dict[str, Any]]] = None, context: Optional[DrawingContext] = None)</ code > </ td > < td > < code > drawing</ code > </ td > </ tr > </ tbody > </ table > </ div >
366366< figure class ="code-block " data-code-id ="a580aa171fb1 ">
367367 < figcaption >
368368 < span > python</ span >
@@ -393,7 +393,7 @@ <h2 id="canvas"><a class="heading-anchor" href="#canvas">#</a>Canvas</h2>
393393</ figure >
394394< h2 id ="drawingcontext-方法 "> < a class ="heading-anchor " href ="#drawingcontext-方法 "> #</ a > DrawingContext 方法</ h2 >
395395< p > < code > DrawingContext</ code > 的每个方法都会向 < code > commands</ code > 追加一个公开命令字典,并返回自身,方便链式调用。</ p >
396- < div class ="table-scroll "> < table > < thead > < tr > < th > API</ th > < th > 签名</ th > < th > 所属类型</ th > </ tr > </ thead > < tbody > < tr > < td > < code > fill_rect</ code > </ td > < td > < code > fill_rect(x: float, y: float, width: float, height: float, color: ColorLike = 'black') -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > < tr > < td > < code > stroke_rect</ code > </ td > < td > < code > stroke_rect(x: float, y: float, width: float, height: float, color: ColorLike = 'black', line_width: float = 1, **kwargs: Any) -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > < tr > < td > < code > fill_circle</ code > </ td > < td > < code > fill_circle(cx: float, cy: float, radius: float, color: ColorLike = 'black') -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > < tr > < td > < code > stroke_circle</ code > </ td > < td > < code > stroke_circle(cx: float, cy: float, radius: float, color: ColorLike = 'black', line_width: float = 1, **kwargs: Any) -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > < tr > < td > < code > fill_ellipse</ code > </ td > < td > < code > fill_ellipse(x: float, y: float, width: float, height: float, color: ColorLike = 'black') -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > < tr > < td > < code > stroke_ellipse</ code > </ td > < td > < code > stroke_ellipse(x: float, y: float, width: float, height: float, color: ColorLike = 'black', line_width: float = 1, **kwargs: Any) -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > < tr > < td > < code > line</ code > </ td > < td > < code > line(x1: float, y1: float, x2: float, y2: float, color: ColorLike = 'black', line_width: float = 1, **kwargs: Any) -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > < tr > < td > < code > fill_text</ code > </ td > < td > < code > fill_text(text: str, x: float, y: float, color: ColorLike = 'black', font_size: float = 16, **kwargs: Any) -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > < tr > < td > < code > fill_path</ code > </ td > < td > < code > fill_path(points: List[Tuple[float, float]], color: ColorLike = 'black', close: bool = True) -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > < tr > < td > < code > stroke_path</ code > </ td > < td > < code > stroke_path(points: List[Tuple[float, float]], color: ColorLike = 'black', line_width: float = 1, close: bool = False, **kwargs: Any) -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > < tr > < td > < code > arc</ code > </ td > < td > < code > arc(cx: float, cy: float, radius: float, start_angle: float = 0, end_angle: float = 360, color: ColorLike = 'black', line_width: float = 1, fill: bool = False, **kwargs: Any) -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > < tr > < td > < code > rounded_rect</ code > </ td > < td > < code > rounded_rect(x: float, y: float, width: float, height: float, corner_radius: float = 8, color: ColorLike = 'black', line_width: float = 1, fill: bool = True, **kwargs: Any) -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > < tr > < td > < code > gradient_rect</ code > </ td > < td > < code > gradient_rect(x: float, y: float, width: float, height: float, colors: Optional[List[ColorLike]] = None, vertical: bool = True) -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > </ tbody > </ table > </ div >
396+ < div class ="table-scroll "> < table > < thead > < tr > < th > API</ th > < th > 签名</ th > < th > 所属类型</ th > </ tr > </ thead > < tbody > < tr > < td > < code > fill_rect</ code > </ td > < td > < code > fill_rect(x: float, y: float, width: float, height: float, color: ColorLike = 'black') -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > < tr > < td > < code > stroke_rect</ code > </ td > < td > < code > stroke_rect(x: float, y: float, width: float, height: float, color: ColorLike = 'black', line_width: float = 1, **kwargs: Any) -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > < tr > < td > < code > fill_circle</ code > </ td > < td > < code > fill_circle(cx: float, cy: float, radius: float, color: ColorLike = 'black') -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > < tr > < td > < code > stroke_circle</ code > </ td > < td > < code > stroke_circle(cx: float, cy: float, radius: float, color: ColorLike = 'black', line_width: float = 1, **kwargs: Any) -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > < tr > < td > < code > fill_ellipse</ code > </ td > < td > < code > fill_ellipse(x: float, y: float, width: float, height: float, color: ColorLike = 'black') -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > < tr > < td > < code > stroke_ellipse</ code > </ td > < td > < code > stroke_ellipse(x: float, y: float, width: float, height: float, color: ColorLike = 'black', line_width: float = 1, **kwargs: Any) -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > < tr > < td > < code > line</ code > </ td > < td > < code > line(x1: float, y1: float, x2: float, y2: float, color: ColorLike = 'black', line_width: float = 1, **kwargs: Any) -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > < tr > < td > < code > fill_text</ code > </ td > < td > < code > fill_text(text: str, x: float, y: float, color: ColorLike = 'black', font_size: float = 16, **kwargs: Any) -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > < tr > < td > < code > fill_path</ code > </ td > < td > < code > fill_path(points: Sequence[Tuple[float, float]], color: ColorLike = 'black', close: bool = True) -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > < tr > < td > < code > stroke_path</ code > </ td > < td > < code > stroke_path(points: Sequence[Tuple[float, float]], color: ColorLike = 'black', line_width: float = 1, close: bool = False, **kwargs: Any) -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > < tr > < td > < code > arc</ code > </ td > < td > < code > arc(cx: float, cy: float, radius: float, start_angle: float = 0, end_angle: float = 360, color: ColorLike = 'black', line_width: float = 1, fill: bool = False, **kwargs: Any) -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > < tr > < td > < code > rounded_rect</ code > </ td > < td > < code > rounded_rect(x: float, y: float, width: float, height: float, corner_radius: float = 8, color: ColorLike = 'black', line_width: float = 1, fill: bool = True, **kwargs: Any) -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > < tr > < td > < code > gradient_rect</ code > </ td > < td > < code > gradient_rect(x: float, y: float, width: float, height: float, colors: Optional[Sequence[ColorLike]] = None, vertical: bool = True) -> Self</ code > </ td > < td > < code > DrawingContext</ code > </ td > </ tr > </ tbody > </ table > </ div >
397397< h3 id ="命令字段 "> < a class ="heading-anchor " href ="#命令字段 "> #</ a > 命令字段</ h3 >
398398< p > 如果直接传 < code > commands</ code > ,使用下面的公开字段:</ p >
399399< div class ="table-scroll "> < table > < thead > < tr > < th > < code > op</ code > </ th > < th > 主要字段</ th > </ tr > </ thead > < tbody > < tr > < td > < code > fill_rect</ code > / < code > stroke_rect</ code > </ td > < td > < code > x</ code > 、< code > y</ code > 、< code > w</ code > 、< code > h</ code > 、< code > c</ code > 、< code > lw</ code > </ td > </ tr > < tr > < td > < code > fill_circle</ code > / < code > stroke_circle</ code > </ td > < td > < code > cx</ code > 、< code > cy</ code > 、< code > r</ code > 、< code > c</ code > 、< code > lw</ code > </ td > </ tr > < tr > < td > < code > fill_ellipse</ code > / < code > stroke_ellipse</ code > </ td > < td > < code > x</ code > 、< code > y</ code > 、< code > w</ code > 、< code > h</ code > 、< code > c</ code > 、< code > lw</ code > </ td > </ tr > < tr > < td > < code > line</ code > </ td > < td > < code > x1</ code > 、< code > y1</ code > 、< code > x2</ code > 、< code > y2</ code > 、< code > c</ code > 、< code > lw</ code > </ td > </ tr > < tr > < td > < code > fill_text</ code > </ td > < td > < code > t</ code > 、< code > x</ code > 、< code > y</ code > 、< code > c</ code > 、< code > fs</ code > </ td > </ tr > < tr > < td > < code > fill_path</ code > / < code > stroke_path</ code > </ td > < td > < code > pts</ code > 、< code > c</ code > 、< code > close</ code > 、< code > lw</ code > </ td > </ tr > < tr > < td > < code > arc</ code > </ td > < td > < code > cx</ code > 、< code > cy</ code > 、< code > r</ code > 、< code > sa</ code > 、< code > ea</ code > 、< code > c</ code > 、< code > lw</ code > 、< code > fill</ code > </ td > </ tr > < tr > < td > < code > rounded_rect</ code > </ td > < td > < code > x</ code > 、< code > y</ code > 、< code > w</ code > 、< code > h</ code > 、< code > cr</ code > 、< code > c</ code > 、< code > lw</ code > 、< code > fill</ code > </ td > </ tr > < tr > < td > < code > gradient_rect</ code > </ td > < td > < code > x</ code > 、< code > y</ code > 、< code > w</ code > 、< code > h</ code > 、< code > colors</ code > 、< code > vertical</ code > </ td > </ tr > </ tbody > </ table > </ div >
@@ -414,7 +414,7 @@ <h3 id="命令字段"><a class="heading-anchor" href="#命令字段">#</a>命令
414414</ figure >
415415< h2 id ="path "> < a class ="heading-anchor " href ="#path "> #</ a > Path</ h2 >
416416< p > < code > Path(commands=None, fill=None, stroke=None, line_width=None)</ code > </ p >
417- < div class ="table-scroll "> < table > < thead > < tr > < th > API</ th > < th > 签名</ th > < th > 分类</ th > </ tr > </ thead > < tbody > < tr > < td > < code > Path</ code > </ td > < td > < code > Path(commands: Optional[List [Dict[str, Any]]] = None, fill: Optional[ColorLike] = None, stroke: Optional[ColorLike] = None, line_width: Optional[float] = None)</ code > </ td > < td > < code > drawing</ code > </ td > </ tr > </ tbody > </ table > </ div >
417+ < div class ="table-scroll "> < table > < thead > < tr > < th > API</ th > < th > 签名</ th > < th > 分类</ th > </ tr > </ thead > < tbody > < tr > < td > < code > Path</ code > </ td > < td > < code > Path(commands: Optional[Sequence [Dict[str, Any]]] = None, fill: Optional[ColorLike] = None, stroke: Optional[ColorLike] = None, line_width: Optional[float] = None)</ code > </ td > < td > < code > drawing</ code > </ td > </ tr > </ tbody > </ table > </ div >
418418< p > Path 命令结构:</ p >
419419< div class ="table-scroll "> < table > < thead > < tr > < th > 命令键</ th > < th > 结构</ th > < th > 行为</ th > </ tr > </ thead > < tbody > < tr > < td > < code > move</ code > </ td > < td > < code > [x, y]</ code > </ td > < td > 移动当前点。</ td > </ tr > < tr > < td > < code > line</ code > </ td > < td > < code > [x, y]</ code > </ td > < td > 添加直线。</ td > </ tr > < tr > < td > < code > curve</ code > </ td > < td > < code > {"to": [x, y], "control1": [x, y], "control2": [x, y]?}</ code > </ td > < td > 二次或三次贝塞尔曲线。</ td > </ tr > < tr > < td > < code > arc</ code > </ td > < td > < code > {"cx": x, "cy": y, "r": r, "start": deg, "end": deg, "clockwise": bool}</ code > </ td > < td > 弧线。</ td > </ tr > < tr > < td > < code > close</ code > </ td > < td > 任意真值</ td > < td > 闭合路径。</ td > </ tr > </ tbody > </ table > </ div >
420420< figure class ="code-block " data-code-id ="f882e1149241 ">
0 commit comments