/**
* 图片平铺
*/
function initDemo7(){
var canvas = document.getElementById("demo7");
if (!canvas) return;
var context = canvas.getContext("2d");
var type = [
"no-repeat", // 不平铺
"repeat-x", // 横向平铺
"repeat-y", // 纵向平铺
"repeat" // 全画布平铺
];
var index = 3;
var img = new Image();
img.src = "images/timg3.jpg";
img.onload = function () {
// 平铺方式
context.fillStyle = context.createPattern(img, type[index]);
context.fillRect(0, 0, canvas.width, canvas.height);
}
}

Canvas 图片平铺设置的更多相关文章

  1. [UWP]通过自定义XamlCompositionBrushBase实现图片平铺

    1. 什么是XamlCompositionBrushBase 我早就想试试自定义XamlCompositionBrushBase,但一直没机会.上一篇文章介绍到使用Win2D的BorderEffect ...

  2. Duilib技巧:背景图片平铺

    贴图的描述 方式有两种    // 1.aaa.jpg    // 2.file='aaa.jpg' res='' restype='0' dest='0,0,0,0' source='0,0,0,0 ...

  3. ie8下背景图片平铺问题

    IE9+及其他浏览器实现背景图片平铺可能需要一个属性就可以background-size:100%/cover; 但是ie8下background-size是不兼容的,因此我们需要用到滤镜,来解决背景 ...

  4. android实现图片平铺效果&WebView多点触控实现缩放

    1.图片平铺效果实现非常简单,只要在xml中添加一个 android:tileMode的属性就可以了.首先在drawable文件夹中添加自己的my.xml文件.代码: Java代码 <?xml ...

  5. LODOP中设置设置图片平铺水印,超文本透明

    之前的博文:LODOP中平铺图片 文本项Repeat. 该博文中是平铺的图片,上面是文本.如果是图片add_print_image和add_print_text纯文本,这两个打印项设计的,可以直接通过 ...

  6. iOS UIButton 设置图片平铺

    UIImage *image2 = [UIImage imageNamed:imgName]; CGFloat top = ; // 顶端盖高度 CGFloat bottom = ; // 底端盖高度 ...

  7. Android中设定背景图片平铺。

    注:本文由Colin撰写,版权所有!转载请注明原文地址,谢谢合作! 在做Android开发时,我们常常需要为程序设定一个背景,但由于现在的Android设备尺寸不一,如果随便设置一个图片为背景,那么很 ...

  8. HTML布局排版2 div的和图片平铺方便管理

    在HTML里,由于浏览器显示器等差异,浏览器的宽度也会有变化,为了适应不同的宽度,需要用到平铺.例如页面前面的固定的条等,如果是纯色,可以用背景色,如果不是纯色,是渐变等,可以用条状图平铺.常见的布局 ...

  9. canvas实现平铺水印

    欲实现的水印平铺的效果图如下: 从图上看,应该做到以下几点: 文字在X和Y方向上进行平铺: 文字进行了一定的角度的旋转: 水印作为背景,其z-index位置应位于页面内容底部, 即不能覆盖页面主内容: ...

随机推荐

  1. IOS 纯代码添加 Button Image Label 添加到自定义View中

    @interface ViewController () /**获取.plist数据*/ @property (nonatomic,strong) NSArray *apps; @end @imple ...

  2. Poj(2225),三维BFS

    题目链接:http://poj.org/problem?id=2225 这里要注意的是,输入的是坐标x,y,z,那么这个点就是在y行,x列,z层上. 我竟然WA在了结束搜索上了,写成了输出s.step ...

  3. 判断团队适不适合使用node

    1.要不要用 2.历史包袱 3.跟进升级 看完scott创业公司使用node,对于一个团队要不要使用node,第一个就是如果承接的项目有很多历史迭代,线上也在稳定的抛,不要轻易的替换,比如很多老代码, ...

  4. 转:adb操作命令详解及大全

    说到 ADB 大家应该都不陌生,即 Android Debug Bridge,Android调试桥,身为 Android 开发的我们,熟练使用 ADB 命令将会大大提升我们的开发效率, ADB 的命令 ...

  5. TeamCity实战(2):NuGet服务器

    如果有在内网架设NuGet服务器的需要,比如说公司要求所有开发人员的开发机与外网隔离,但是项目开发又必须要通过NuGet获取开发包的情况. 打开选项其实很简单,但是打开之后怎么样更新开发包要复杂些了. ...

  6. python剑指offer最小的K个数

    题目描述: 输入n个整数,找出其中最小的K个数.例如输入4,5,1,6,2,7,3,8这8个数字,则最小的4个数字是1,2,3,4,. 思路: 使用快排中的partition思想. ①我们设定part ...

  7. sql学习之创建表空间创建用户并授权

    --创建表空间语法:create tablespace [name]create tablespace hclTest--设置参数datafile 'F:/orcale/hclTest'--设置表空间 ...

  8. Firefox 修改User Agent

    Android 版 Mozilla/5.0 (Linux; U; Android 2.2; en-us; Nexus One Build/FRF91) AppleWebKit/533.1 (KHTML ...

  9. 利用sysbench进行MySQL OLTP基准测试

      Preface       In order to know clearly about the real performance threshold of database server,we ...

  10. Python文件IO(普通文件读写)

    ## 打开一个文件 - fileobj = open(filename, mode) 其中: fileobj是open()返回的文件对象 filename是该文件的字符串名 mode是指明文件类型和操 ...