<html>

	<body>

		<canvas id="canvas" width="100" height="100" style="background-color: #000;"/>

		<script>

			function position  (x,y){

				this.x = x;

				this.y = y;

			}

			var canvas = document.getElementById('canvas'),

				ctx = canvas.getContext('2d');

				width = canvas.width,

				height = canvas.height;

			ctx.fillStyle = "#FF0000";

			ctx.font = "20px Arial";

			ctx.fillText("妈妈",10,50);

			var pixs = ctx.getImageData(0,0,width,height).data;

			var Pixels = new Array();

			for(var i=0;i<pixs.length;i+= 4)

			{

				var r = pixs[i],

					g = pixs[i+1],

					b = pixs[i+2],

					a = pixs[i+3];

				if(r != 0 || g != 0 || b != 0 ){

					var x = i%400;

					var y = i/400;

					Pixels.push(new position(x,y));

				}

			}

		</script>

	</body>

</html>

　　

JavaScript Canvas 根据像素点取位置的更多相关文章

  1. 转载——JavaScript学习笔记：取数组中最大值和最小值

    转载自:http://www.w3cplus.com/javascript/calculate-the-max-min-value-from-an-array.html. 取数组中最大值 可以先把思路 ...

  2. JavaScript四种数值取整方法

    一.Math.trunc() 1.定义 Math.trunc()方法去除数字的小数部分,保留整数部分. 2.语法 Math.trunc(value) 3.示例 console.log(Math.tru ...

  3. android GPS 定位，取位置信息

    现在很多app ,需要取位置信息,所以我也做了一个模块用来取位置信息:   加入位置服务所需的权限: <uses-permission android:name="android.pe ...

  4. javascript canvas 生成图片的方法

    javascript canvas 生成图片的方法 先生成base64格式的图片 然后ajax传到后台 写入服务器文件夹即可<pre><!DOCTYPE HTML><ht ...

  5. 用Javascript获取页面元素的位置

    制作网页的过程中,你有时候需要知道某个元素在网页上的确切位置. 下面的教程总结了Javascript在网页定位方面的相关知识. 一.网页的大小和浏览器窗口的大小 首先,要明确两个基本概念. 一张网页的 ...

  6. JavaScript+canvas 绘制多边形

    效果图: <body> <canvas id="square" width="500"></canvas> <canv ...

  7. [JavaScript] canvas 合成图片和文字

    Canvas Canvas 是 HTML5 新增的组件,就像一个画板,用 js 这杆笔,在上面乱涂乱画 创建一个 canvas <canvas id="stockGraph" ...

  8. 用javascript/jQuery给CKEditor取值/赋值

    CKEditor 是著名的 HTML 编辑器,IBM.Oracle.Adobe 等都在用.CKEditor 创建于 2003 年,其前身为 FCKEditor,在 2009 年的时候把“F”去掉了,更 ...

  9. 从零开始手把手教你使用javascript+canvas开发一个塔防游戏01地图创建

    项目演示 项目演示地址: 体验一下 项目源码: 项目源码 代码结构 本节做完效果 游戏主页面 index.html <!DOCTYPE html PUBLIC "-//W3C//DTD ...

随机推荐

  1. HDU 3549 网络最大流再试

    http://acm.hdu.edu.cn/showproblem.php?pid=3549 同样的网络最大流 T了好几次原因是用了cout,改成printf就A了 还有HDU oj的编译器也不支持以 ...

  2. Codeforces 566 D. Restructuring Company

    Description 一开始有 \(n\) 个元素,可以进行几个操作. 合并 \(x,y\) . 合并 \(x,x+1,...,y\) . 询问 \(x,y\) 是否在一个集合中. Sol 并查集+ ...

  3. tinyhttp源码阅读(注释)

    这里就不细述了,代码很简单. 其实现的功能比较若,可以做一个参考. 因为其通过文件的权限位来判断是否是一个CGI脚本,所以在权限位不对的情况下会判断不正确.例如我将这个目录放置在NTFS分区,所有的文 ...

  4. linux下一个有意思的问题(文件名以短划线或空格开头)

    linux下一个有意思的问题(文件名以短划线开头) 这本是无意中的一个发现. 在linux下,文件名中含有 - 是没有问题,但是如果文件名是以-作为第一个字符的,那么就比较麻烦了. 问题演示 看这里, ...

  5. admin 后台 bs模板

    http://bootsnipp.com/ https://almsaeedstudio.com/preview

  6. phpstorm配置代码自动同步到服务器

    首先找到你的菜单栏找到Tools 然后点击配置 填写你的服务器信息 填写好项目目录 选择自动上传

  7. js的工作原理

    JavaScript就是所谓的客户端脚本语言,是一种在互联网浏览器(浏览器也称为Web客户端,因为它连接到Web服务器上,以下载页面)内部运行的计算机编程语言. 也就是说,如果一个网页里有js代码,那 ...

  8. Max Subsequence

    一个sequence,里面都是整数,求最长的subsequence的长度,使得这个subsquence的最大值和最小值相差不超过1. 比如[1,3,2,2,5,2,3,7]最长的subsequence ...

  9. Java中 final static super this instanceof 关键字用法

    一.final关键字 final可以修饰变量.方法及类: 1.当定义一个final变量时,jvm会将其分配到常量池中,其所修饰的对象只能赋值一次,对基本类型来说是其值不可变,引用类型(包括作为函数形参 ...

  10. SHAREPOINT - CAML列表查询

    首先要了解的是CAML(Collaboration Application Markup Language)不仅仅是用在对列表.文档库的查询,字段的定义,站点定义等处处使用的都是CAML. 简单的提一 ...