JavaScript Canvas 根据像素点取位置
<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 根据像素点取位置的更多相关文章
- 转载——JavaScript学习笔记:取数组中最大值和最小值
转载自:http://www.w3cplus.com/javascript/calculate-the-max-min-value-from-an-array.html. 取数组中最大值 可以先把思路 ...
- JavaScript四种数值取整方法
一.Math.trunc() 1.定义 Math.trunc()方法去除数字的小数部分,保留整数部分. 2.语法 Math.trunc(value) 3.示例 console.log(Math.tru ...
- android GPS 定位,取位置信息
现在很多app ,需要取位置信息,所以我也做了一个模块用来取位置信息: 加入位置服务所需的权限: <uses-permission android:name="android.pe ...
- javascript canvas 生成图片的方法
javascript canvas 生成图片的方法 先生成base64格式的图片 然后ajax传到后台 写入服务器文件夹即可<pre><!DOCTYPE HTML><ht ...
- 用Javascript获取页面元素的位置
制作网页的过程中,你有时候需要知道某个元素在网页上的确切位置. 下面的教程总结了Javascript在网页定位方面的相关知识. 一.网页的大小和浏览器窗口的大小 首先,要明确两个基本概念. 一张网页的 ...
- JavaScript+canvas 绘制多边形
效果图: <body> <canvas id="square" width="500"></canvas> <canv ...
- [JavaScript] canvas 合成图片和文字
Canvas Canvas 是 HTML5 新增的组件,就像一个画板,用 js 这杆笔,在上面乱涂乱画 创建一个 canvas <canvas id="stockGraph" ...
- 用javascript/jQuery给CKEditor取值/赋值
CKEditor 是著名的 HTML 编辑器,IBM.Oracle.Adobe 等都在用.CKEditor 创建于 2003 年,其前身为 FCKEditor,在 2009 年的时候把“F”去掉了,更 ...
- 从零开始手把手教你使用javascript+canvas开发一个塔防游戏01地图创建
项目演示 项目演示地址: 体验一下 项目源码: 项目源码 代码结构 本节做完效果 游戏主页面 index.html <!DOCTYPE html PUBLIC "-//W3C//DTD ...
随机推荐
- 瀑布流js排列
var _px = document.getElementById("px"); var con=document.getElementById("content&quo ...
- Spring的scope="prototype"属性
spring 默认scope 是单例模式这样只会创建一个Action对象每次访问都是同一个Action对象,数据不安全struts2 是要求 每次次访问 都对应不同的Actionscope=" ...
- Visual Studio 2010添加新项缺失[ADO.NET 实体数据模型]解决方法
当进行ASP.NET MVC项目开发,准备使用EF进行数据库访问,我的开发模式是"Table First".于是,准备在Model目录新建EF的数据表映射文件.可是,在添加新项目窗 ...
- Excel导出的几种方式
1.html 前台html与js代码(文件:ExportExcelByHtml.aspx): <html xmlns="http://www.w3.org/1999/xhtml&quo ...
- join
一句话 join(param) 是把 array 连城一个字符串,中间用 param隔开
- c#.net对excel的操作——创建一个excel报表两个sheet就是2个表分别添加内容
添加引用:Microsoft.Office.Interop.Excel //创建excel对象,就是实例化一个excel对象 Application excel=new Appl ...
- 关于QQ使用的一些代码
http://wiki.open.qq.com/wiki/website/网站接入wiki索引
- jQuery DataTables && Django serializer
jQuery DataTables https://www.datatables.net 本文参考的官方示例 http://datatables.net/release-datatables/exam ...
- jdbc事务处理和连接池
JDBC: * JDBC概念:Java DataBase Connectivity(Java数据库连接) SUN公司提供的一组连接数据库API. * JDBC开发步骤: * 1.注册驱动. * 2.获 ...
- appium + python 环境搭建
所需:JDK.Android SDK.Appium服务程序.Appium客户端程序 1. 安装最新的JDK,并配置环境变量. JAVA_HOME=C:\Program Files (x86)\Java ...