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


TypeScript Context2d.translate方法代码示例

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


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

示例1: _render

  protected _render(ctx: Context2d, indices: number[], {sx, sy, svx, svy, _scale}: HexTileData): void {
    for (const i of indices) {
      if (isNaN(sx[i] + sy[i] + _scale[i]))
        continue;

      ctx.translate(sx[i], sy[i])
      ctx.beginPath();
      for (let j = 0; j < 6; j++) {
        ctx.lineTo(svx[j]*_scale[i], svy[j]*_scale[i])
      }
      ctx.closePath()
      ctx.translate(-sx[i], -sy[i])

      if (this.visuals.fill.doit) {
        this.visuals.fill.set_vectorize(ctx, i);
        ctx.fill();
      }

      if (this.visuals.line.doit) {
        this.visuals.line.set_vectorize(ctx, i);
        ctx.stroke();
      }

    }
  }
开发者ID:gully,项目名称:bokeh,代码行数:25,代码来源:hex_tile.ts

示例2: _render

  protected _render(ctx: Context2d, indices: number[], {image_data, sx, sy, sw, sh}: _ImageData): void {
    const old_smoothing = ctx.getImageSmoothingEnabled()
    ctx.setImageSmoothingEnabled(false)

    ctx.globalAlpha = this.model.global_alpha

    for (const i of indices) {
      if (image_data[i] == null)
        continue

      if (isNaN(sx[i] + sy[i] + sw[i] + sh[i]))
        continue

      const y_offset = sy[i]

      ctx.translate(0, y_offset)
      ctx.scale(1, -1)
      ctx.translate(0, -y_offset)
      ctx.drawImage(image_data[i], sx[i]|0, sy[i]|0, sw[i], sh[i])
      ctx.translate(0, y_offset)
      ctx.scale(1, -1)
      ctx.translate(0, -y_offset)
    }

    ctx.setImageSmoothingEnabled(old_smoothing)
  }
开发者ID:Zyell,项目名称:bokeh,代码行数:26,代码来源:image.ts

示例3: _render

  protected _render(ctx: Context2d, indices: number[], {sx, sy, sw, sh, _angle}: OvalData): void {
    for (const i of indices) {
      if (isNaN(sx[i] + sy[i] + sw[i] + sh[i] + _angle[i]))
        continue

      ctx.translate(sx[i], sy[i])
      ctx.rotate(_angle[i])

      ctx.beginPath()
      ctx.moveTo(0, -sh[i]/2)
      ctx.bezierCurveTo( sw[i]/2, -sh[i]/2,  sw[i]/2,  sh[i]/2, 0,  sh[i]/2)
      ctx.bezierCurveTo(-sw[i]/2,  sh[i]/2, -sw[i]/2, -sh[i]/2, 0, -sh[i]/2)
      ctx.closePath()

      if (this.visuals.fill.doit) {
        this.visuals.fill.set_vectorize(ctx, i)
        ctx.fill()
      }

      if (this.visuals.line.doit) {
        this.visuals.line.set_vectorize(ctx, i)
        ctx.stroke()
      }

      ctx.rotate(-_angle[i])
      ctx.translate(-sx[i], -sy[i])
    }
  }
开发者ID:gully,项目名称:bokeh,代码行数:28,代码来源:oval.ts

示例4: _render

  _render(ctx: Context2d, indices, {image_data, sx, sy, sw, sh}) {
    const old_smoothing = ctx.getImageSmoothingEnabled();
    ctx.setImageSmoothingEnabled(false);

    for (const i of indices) {
      if ((image_data[i] == null)) {
        continue;
      }
      if (isNaN(sx[i]+sy[i]+sw[i]+sh[i])) {
        continue;
      }

      const y_offset = sy[i];

      ctx.translate(0, y_offset);
      ctx.scale(1, -1);
      ctx.translate(0, -y_offset);
      ctx.drawImage(image_data[i], sx[i]|0, sy[i]|0, sw[i], sh[i]);
      ctx.translate(0, y_offset);
      ctx.scale(1, -1);
      ctx.translate(0, -y_offset);
    }

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

示例5: _render

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

      ctx.translate(sx[i], sy[i]);
      ctx.rotate(this._angle[i]);

      ctx.beginPath();
      ctx.moveTo(0, -sh[i]/2);
      ctx.bezierCurveTo( sw[i]/2, -sh[i]/2,  sw[i]/2,  sh[i]/2, 0,  sh[i]/2);
      ctx.bezierCurveTo(-sw[i]/2,  sh[i]/2, -sw[i]/2, -sh[i]/2, 0, -sh[i]/2);
      ctx.closePath();

      if (this.visuals.fill.doit) {
        this.visuals.fill.set_vectorize(ctx, i);
        ctx.fill();
      }

      if (this.visuals.line.doit) {
        this.visuals.line.set_vectorize(ctx, i);
        ctx.stroke();
      }

      ctx.rotate(-this._angle[i]);
      ctx.translate(-sx[i], -sy[i]);
    }
  }
开发者ID:FourtekIT-incubator,项目名称:bokeh,代码行数:29,代码来源:oval.ts

示例6: _render

  _render(ctx: Context2d, indices, {sx, sy, slength, _angle}) {
    if (this.visuals.line.doit) {
      const width = this.renderer.plot_view.frame._width.value;
      const height = this.renderer.plot_view.frame._height.value;
      const inf_len = 2 * (width + height);

      for (let i = 0, end = slength.length; i < end; i++) {
        if (slength[i] === 0) {
          slength[i] = inf_len;
        }
      }

      for (const i of indices) {
        if (isNaN(sx[i]+sy[i]+_angle[i]+slength[i])) {
          continue;
        }

        ctx.translate(sx[i], sy[i]);
        ctx.rotate(_angle[i]);

        ctx.beginPath();
        ctx.moveTo(0, 0);
        ctx.lineTo(slength[i], 0);

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

        ctx.rotate(-_angle[i]);
        ctx.translate(-sx[i], -sy[i]);
      }
    }
  }
开发者ID:FourtekIT-incubator,项目名称:bokeh,代码行数:32,代码来源:ray.ts

示例7: _render

  protected _render(ctx: Context2d, indices: number[],
                    {sx, sy, _start_angle, _angle, sinner_radius, souter_radius}: AnnularWedgeData): void {
    const direction = this.model.properties.direction.value();

    for (const i of indices) {
      if (isNaN(sx[i] + sy[i] + sinner_radius[i] + souter_radius[i] + _start_angle[i] + _angle[i]))
        continue;

      ctx.translate(sx[i], sy[i]);
      ctx.rotate(_start_angle[i]);

      ctx.moveTo(souter_radius[i], 0);
      ctx.beginPath();
      ctx.arc(0, 0, souter_radius[i], 0, _angle[i], direction);
      ctx.rotate(_angle[i]);
      ctx.lineTo(sinner_radius[i], 0);
      ctx.arc(0, 0, sinner_radius[i], 0, -_angle[i], !direction);
      ctx.closePath();

      ctx.rotate(-_angle[i]-_start_angle[i]);
      ctx.translate(-sx[i], -sy[i]);

      if (this.visuals.fill.doit) {
        this.visuals.fill.set_vectorize(ctx, i);
        ctx.fill();
      }

      if (this.visuals.line.doit) {
        this.visuals.line.set_vectorize(ctx, i);
        ctx.stroke();
      }
    }
  }
开发者ID:Zyell,项目名称:bokeh,代码行数:33,代码来源:annular_wedge.ts

示例8: _render

  protected _render(ctx: Context2d, indices: number[], {sx, sy, slength, _angle}: RayData): void {
    if (this.visuals.line.doit) {
      const width = this.renderer.plot_view.frame._width.value
      const height = this.renderer.plot_view.frame._height.value
      const inf_len = 2 * (width + height)

      for (let i = 0, end = slength.length; i < end; i++) {
        if (slength[i] == 0)
          slength[i] = inf_len
      }

      for (const i of indices) {
        if (isNaN(sx[i] + sy[i] + _angle[i] + slength[i]))
          continue

        ctx.translate(sx[i], sy[i])
        ctx.rotate(_angle[i])

        ctx.beginPath()
        ctx.moveTo(0, 0)
        ctx.lineTo(slength[i], 0)

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

        ctx.rotate(-_angle[i])
        ctx.translate(-sx[i], -sy[i])
      }
    }
  }
开发者ID:Zyell,项目名称:bokeh,代码行数:30,代码来源:ray.ts

示例9: _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

示例10: _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


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