当前位置: 首页>>代码示例>>TypeScript>>正文


TypeScript Context2d.fillRect方法代码示例

本文整理汇总了TypeScript中core/util/canvas.Context2d.fillRect方法的典型用法代码示例。如果您正苦于以下问题:TypeScript Context2d.fillRect方法的具体用法?TypeScript Context2d.fillRect怎么用?TypeScript Context2d.fillRect使用的例子?那么恭喜您, 这里精选的方法代码示例或许可以为您提供帮助。您也可以进一步了解该方法所在core/util/canvas.Context2d的用法示例。


在下文中一共展示了Context2d.fillRect方法的10个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于系统推荐出更棒的TypeScript代码示例。

示例1: generic_area_legend

export function generic_area_legend(visuals: {line?: Line, fill: Fill, hatch?: Hatch}, ctx: Context2d, {x0, x1, y0, y1}: Area, index: number): void {
  const w = Math.abs(x1 - x0)
  const dw = w*0.1
  const h = Math.abs(y1 - y0)
  const dh = h*0.1

  const sx0 = x0 + dw
  const sx1 = x1 - dw

  const sy0 = y0 + dh
  const sy1 = y1 - dh

  if (visuals.fill.doit) {
    visuals.fill.set_vectorize(ctx, index)
    ctx.fillRect(sx0, sy0, sx1 - sx0, sy1 - sy0)
  }

  if (visuals.hatch != null && visuals.hatch.doit) {
    visuals.hatch.set_vectorize(ctx, index)
    ctx.fillRect(sx0, sy0, sx1 - sx0, sy1 - sy0)
  }

  if (visuals.line && visuals.line.doit) {
    ctx.beginPath()
    ctx.rect(sx0, sy0, sx1 - sx0, sy1 - sy0)
    visuals.line.set_vectorize(ctx, index)
    ctx.stroke()
  }
}
开发者ID:digitalsatori,项目名称:Bokeh,代码行数:29,代码来源:utils.ts

示例2: _render

  _render(ctx: Context2d, indices, {sx, sy, sx0, sy1, sw, sh, _angle}) {
    if (this.visuals.fill.doit) {
      for (const i of indices) {
        if (isNaN(sx[i] + sy[i] + sx0[i] + sy1[i] + sw[i] + sh[i] + _angle[i])) {
          continue;
        }

        //no need to test the return value, we call fillRect for every glyph anyway
        this.visuals.fill.set_vectorize(ctx, i);

        if (_angle[i]) {
          ctx.translate(sx[i], sy[i]);
          ctx.rotate(_angle[i]);
          ctx.fillRect(-sw[i]/2, -sh[i]/2, sw[i], sh[i]);
          ctx.rotate(-_angle[i]);
          ctx.translate(-sx[i], -sy[i]);
        } else {
          ctx.fillRect(sx0[i], sy1[i], sw[i], sh[i]);
        }
      }
    }

    if (this.visuals.line.doit) {
      ctx.beginPath();

      for (const i of indices) {

        if (isNaN(sx[i] + sy[i] + sx0[i] + sy1[i] + sw[i] + sh[i] + _angle[i])) {
          continue;
        }

        // fillRect does not fill zero-height or -width rects, but rect(...)
        // does seem to stroke them (1px wide or tall). Explicitly ignore rects
        // with zero width or height to be consistent
        if ((sw[i]===0) || (sh[i]===0)) {
          continue;
        }

        if (_angle[i]) {
          ctx.translate(sx[i], sy[i]);
          ctx.rotate(_angle[i]);
          ctx.rect(-sw[i]/2, -sh[i]/2, sw[i], sh[i]);
          ctx.rotate(-_angle[i]);
          ctx.translate(-sx[i], -sy[i]);
        } else {
          ctx.rect(sx0[i], sy1[i], sw[i], sh[i]);
        }

        this.visuals.line.set_vectorize(ctx, i);
        ctx.stroke();
        ctx.beginPath();
      }

      return ctx.stroke();
    }
  }
开发者ID:FourtekIT-incubator,项目名称:bokeh,代码行数:56,代码来源:rect.ts

示例3: _render

  protected _render(ctx: Context2d, indices: number[], {sx, sy, sx0, sy1, sw, sh, _angle}: RectData): void {
    if (this.visuals.fill.doit) {
      for (const i of indices) {
        if (isNaN(sx[i] + sy[i] + sx0[i] + sy1[i] + sw[i] + sh[i] + _angle[i]))
          continue

        //no need to test the return value, we call fillRect for every glyph anyway
        this.visuals.fill.set_vectorize(ctx, i)

        if (_angle[i]) {
          ctx.translate(sx[i], sy[i])
          ctx.rotate(_angle[i])
          ctx.fillRect(-sw[i]/2, -sh[i]/2, sw[i], sh[i])
          ctx.rotate(-_angle[i])
          ctx.translate(-sx[i], -sy[i])
        } else
          ctx.fillRect(sx0[i], sy1[i], sw[i], sh[i])
      }
    }

    if (this.visuals.line.doit) {
      ctx.beginPath()

      for (const i of indices) {
        if (isNaN(sx[i] + sy[i] + sx0[i] + sy1[i] + sw[i] + sh[i] + _angle[i]))
          continue

        // fillRect does not fill zero-height or -width rects, but rect(...)
        // does seem to stroke them (1px wide or tall). Explicitly ignore rects
        // with zero width or height to be consistent
        if (sw[i] == 0 || sh[i] == 0)
          continue

        if (_angle[i]) {
          ctx.translate(sx[i], sy[i])
          ctx.rotate(_angle[i])
          ctx.rect(-sw[i]/2, -sh[i]/2, sw[i], sh[i])
          ctx.rotate(-_angle[i])
          ctx.translate(-sx[i], -sy[i])
        } else
          ctx.rect(sx0[i], sy1[i], sw[i], sh[i])

        this.visuals.line.set_vectorize(ctx, i)
        ctx.stroke()
        ctx.beginPath()
      }

      ctx.stroke()
    }
  }
开发者ID:Zyell,项目名称:bokeh,代码行数:50,代码来源:rect.ts

示例4: _paint_empty

  protected _paint_empty(ctx: Context2d, frame_box: FrameBox): void {
    const [cx, cy, cw, ch] = [0, 0, this.canvas_view.model._width.value, this.canvas_view.model._height.value]
    const [fx, fy, fw, fh] = frame_box

    ctx.clearRect(cx, cy, cw, ch)

    if (this.visuals.border_fill.doit) {
      this.visuals.border_fill.set_value(ctx)
      ctx.fillRect(cx, cy, cw, ch)
      ctx.clearRect(fx, fy, fw, fh)
    }

    if (this.visuals.background_fill.doit) {
      this.visuals.background_fill.set_value(ctx)
      ctx.fillRect(fx, fy, fw, fh)
    }
  }
开发者ID:gully,项目名称:bokeh,代码行数:17,代码来源:plot_canvas.ts

示例5: _draw_regions

 protected _draw_regions(ctx: Context2d): void {
   if (!this.visuals.band_fill.doit)
     return
   const [xs, ys] = this.grid_coords('major', false)
   this.visuals.band_fill.set_value(ctx)
   for (let i = 0; i < xs.length-1; i++) {
     if (i % 2 == 1) {
       const [sx0, sy0] = this.plot_view.map_to_screen(xs[i],   ys[i],   this._x_range_name, this._y_range_name)
       const [sx1, sy1] = this.plot_view.map_to_screen(xs[i+1], ys[i+1], this._x_range_name, this._y_range_name)
       ctx.fillRect(sx0[0], sy0[0], sx1[1] - sx0[0], sy1[1] - sy0[0])
     }
   }
 }
开发者ID:jsignell,项目名称:bokeh,代码行数:13,代码来源:grid.ts

示例6: _draw_bbox

 _draw_bbox(ctx: Context2d) {
   const bbox = this.compute_legend_dimensions();
   ctx.save();
   if (this.visuals.background_fill.doit) {
     this.visuals.background_fill.set_value(ctx);
     ctx.fillRect(0, 0, bbox.width, bbox.height);
   }
   if (this.visuals.border_line.doit) {
     this.visuals.border_line.set_value(ctx);
     ctx.strokeRect(0, 0, bbox.width, bbox.height);
   }
   return ctx.restore();
 }
开发者ID:FourtekIT-incubator,项目名称:bokeh,代码行数:13,代码来源:color_bar.ts

示例7: _draw_bbox

 protected _draw_bbox(ctx: Context2d): void {
   const bbox = this.compute_legend_dimensions()
   ctx.save()
   if (this.visuals.background_fill.doit) {
     this.visuals.background_fill.set_value(ctx)
     ctx.fillRect(0, 0, bbox.width, bbox.height)
   }
   if (this.visuals.border_line.doit) {
     this.visuals.border_line.set_value(ctx)
     ctx.strokeRect(0, 0, bbox.width, bbox.height)
   }
   ctx.restore()
 }
开发者ID:jsignell,项目名称:bokeh,代码行数:13,代码来源:color_bar.ts

示例8: _render

  protected _render(ctx: Context2d, indices: number[],
                    {sleft, sright, stop, sbottom}: BoxData): void {
    for (const i of indices) {
      if (isNaN(sleft[i] + stop[i] + sright[i] + sbottom[i]))
        continue

      if (this.visuals.fill.doit) {
        this.visuals.fill.set_vectorize(ctx, i)
        ctx.fillRect(sleft[i], stop[i], sright[i] - sleft[i], sbottom[i] - stop[i])
      }

      if (this.visuals.line.doit) {
        ctx.beginPath()
        ctx.rect(sleft[i], stop[i], sright[i] - sleft[i], sbottom[i] - stop[i])
        this.visuals.line.set_vectorize(ctx, i)
        ctx.stroke()
      }
    }
  }
开发者ID:gully,项目名称:bokeh,代码行数:19,代码来源:box.ts

示例9: _render

  _render(ctx: Context2d, indices, {sleft, sright, stop, sbottom}) {
    for (const i of indices) {
      if (isNaN(sleft[i]+stop[i]+sright[i]+sbottom[i])) {
        continue;
      }

      if (this.visuals.fill.doit) {
        this.visuals.fill.set_vectorize(ctx, i);
        ctx.fillRect(sleft[i], stop[i], sright[i]-sleft[i], sbottom[i]-stop[i]);
      }

      if (this.visuals.line.doit) {
        ctx.beginPath();
        ctx.rect(sleft[i], stop[i], sright[i]-sleft[i], sbottom[i]-stop[i]);
        this.visuals.line.set_vectorize(ctx, i);
        ctx.stroke();
      }
    }
  }
开发者ID:FourtekIT-incubator,项目名称:bokeh,代码行数:19,代码来源:box.ts

示例10: _draw_regions

  protected _draw_regions(ctx: Context2d): void {
    if (!this.visuals.band_fill.doit && !this.visuals.band_hatch.doit)
      return

    this.visuals.band_fill.set_value(ctx)

    const [xs, ys] = this.grid_coords('major', false)
    for (let i = 0; i < xs.length-1; i++) {
      if (i % 2 != 1)
        continue

      const [sx0, sy0] = this.plot_view.map_to_screen(xs[i],   ys[i],   this._x_range_name, this._y_range_name)
      const [sx1, sy1] = this.plot_view.map_to_screen(xs[i+1], ys[i+1], this._x_range_name, this._y_range_name)

      if (this.visuals.band_fill.doit)
        ctx.fillRect(sx0[0], sy0[0], sx1[1] - sx0[0], sy1[1] - sy0[0])

      this.visuals.band_hatch.doit2(ctx, i, () => {
        ctx.fillRect(sx0[0], sy0[0], sx1[1] - sx0[0], sy1[1] - sy0[0])
      }, () => this.request_render())

    }
  }
开发者ID:digitalsatori,项目名称:Bokeh,代码行数:23,代码来源:grid.ts


注:本文中的core/util/canvas.Context2d.fillRect方法示例由纯净天空整理自Github/MSDocs等开源代码及文档管理平台,相关代码片段筛选自各路编程大神贡献的开源项目,源码版权归原作者所有,传播和使用请参考对应项目的License;未经允许,请勿转载。