- 浏览: 143820 次
- 性别:
- 来自: 西安
最新评论
-
yukang1:
怎么关闭vbs呢 唉
利用VBScript在隐藏窗口中运行应用程序 -
greatghoul:
hanmiao 写道好用,我在 51CTO 上也找到了类似的解 ...
JFreeChart中文乱码和文字模糊问题的通用解决方案 | #java #chart -
hanmiao:
好用,我在 51CTO 上也找到了类似的解决方案,也是通过自定 ...
JFreeChart中文乱码和文字模糊问题的通用解决方案 | #java #chart -
janecd:
...
java BoxLayout布局心得 | #java #swing -
janecd:
java BoxLayout布局心得 | #java #swing
用JavaScript画直线、圆、椭圆(不用VML,Canvas) | #hta #javascript #2d
- 博客分类:
- Development
以前计算机图形学的课程设计,算法什么的都是书上Copy的,只不过不用c,而用js而已。
(话说我图形学机试100分,笔试17分,你说杯具不杯具,俺不想研究其理论,只想用它的公式做出我想要的东西而已)。
核心代码:
倒是没有试过在运行时删除hta文件,应该是可以直接删除的,因为以前有人用 HTA 做的软件开发了自动更新的功能,通过ajax方法读取更新后的文件,覆盖旧版本的文件,然后刷新 HTA ,便是新版本了.
不过 HTA 虽然有很多东西可以用,权限也高,但是不能跨平台.豆瓣有一个叫做 onering 的东西,有比较好的跨平台能力,但是发布后,几乎都没有怎么更新.
如果能够 HTML5 和现在性能越来越好的 javascript 或者一些其它的脚本语言,兴趣真有不小的玩头.
这个例子其实并没有表现出hta的什么特性。
你在例子运行的时候,删一个hta文件试试
这个例子其实并没有表现出hta的什么特性。
(话说我图形学机试100分,笔试17分,你说杯具不杯具,俺不想研究其理论,只想用它的公式做出我想要的东西而已)。
核心代码:
/** * GCanvas 1.2 * @author GreatGhoul * @email: greatghoul@gmail.com * @blog: http://greatghoul.iteye.com */ (function() { // 创建GCanvas构造方法的闭包和全局引用 var GCanvas = window.GCanvas = function(id, w, h) { return new Canvas(id, w, h); } /** * 用指定的id, 长和宽构造一个画板 * * @param id html元素的id * @param w 指定的画板宽度 * @param h 指定的画板高度 */ var Canvas = function(id, w, h) { // 只想Canvas实例,以修正this指针的引用错误. var self = this; // 缓冲器 var cache = []; // 画板绑定到的html元素的引用 var canvas = document.getElementById(id); // 画板底色, 默认为浅灰色 var bgColor = "lightgray"; // 笔刷的颜色, 默认为黑色 var fgColor = "black"; // 原点坐标, 初始为(0, 0) var oX = 0, oY = 0; // 是否允许点画到画板边界以外 var allowOutside = false; // 渲染html元素 canvas.onselectstart = function() {return false;} canvas.style.overflow = "hidden"; canvas.style.background = "lightblue"; canvas.style.width = (w ? w : 400) + "px"; canvas.style.height = (h ? h : 400) + "px"; this.copyright = function() { var c = "# G2W GCanvas [Version 1.2]\n" + "# (C) Copyright 2009-2010 G2W Blog.\n" + "# http://greatghoul.iteye.com \n"; return c; } /** * 获取画板左上角的在文档中的绝对坐标 * * @return 形如{x, y}的坐标 */ this.pos = function() { var rect = canvas.getClientRects()[0]; return { x: rect.left, y: rect.top }; } /** * 清空画板 */ this.clear = function() { cache = []; canvas.innerHTML = ""; } /** * 设置或取得画板的大小, 如果缓存不为空,则设置无效 * * @param w 新的宽度 * @param h 新的高度 * @return 形如{width, height}的尺寸 */ this.size = function(w, h) { if (w && h) { if (cache.length != 0) return; canvas.style.width = w + "px"; canvas.style.height = h + "px"; } else { return { width: parseInt(canvas.style.width), height: parseInt(canvas.style.width) }; } } /** * 设置或取得是否允许点显示到画板边界以外 * * @param flag true为允许显示,false为不允许,其它为不做改变 * @return 是否允许显示 */ this.allowOutside = function(flag) { if (flag == true || flag == false) allowOutside = flag; return allowOutside; } /** * 设置或取得笔刷颜色 * 颜色的格式为: * rgb(r, g, b) 其中r, g, b为0-255的整数 * #000000 ~ #FFFFFF * 字符串描述 如: red, blue, black, lightblue * * @param color 新的笔刷颜色 * @return 当前笔刷颜色 */ this.fgColor = function(color) { fgColor = (color ? color: fgColor); return fgColor; } /** * 设置或取得画布颜色 * 颜色的格式为: * rgb(r, g, b) 其中r, g, b为0-255的整数 * #000000 ~ #FFFFFF * 字符串描述 如: red, blue, black, lightblue * * @param color 新的画布颜色 * @return 当前画布颜色 */ this.bgColor = function(color) { bgColor = (color ? color: bgColor); canvas.style.background = bgColor; return bgColor; } /** * 在给定的坐标出画点 * * @param x x坐标 * @param y y坐标 */ this.point = function(x, y) { var pos = self.pos(); var size = self.size(); x = pos.x + oX + x; y = pos.y + oY + y; // 如果不允许在边界外显示点,则不讲该点推入缓存 if (!allowOutside && !((x >= pos.x && x <= pos.x + size.width) && (y >= pos.y && y <= pos.y + size.height))) return; cache.push("<div style='width:1px;height:1px;position:absolute;left:" + x +"px;top:" + y + "px;background-color:" + fgColor + ";font-size:0px;z-index:999;'></div>"); } /** * 数值微分法画直线 * * @param x0 起点x坐标 * @param y0 起点y坐标 * @param x1 终点x坐标 * @param y1 终点y坐标 */ function line_DDA(x0, y0, x1, y1) { var px = x0, py = y0; var dx = x1 - x0; var dy = y1 - y0; var incX = 0, incY = 0; var epsl = Math.abs(dx) > Math.abs(dy) ? Math.abs(dx) : Math.abs(dy); incX = dx / epsl; incY = dy / epsl; for (var i = 0; i < epsl; i++) { self.point(parseInt(px + 0.5), parseInt(py + 0.5)); px += incX; py += incY; } } /** * 用给定的起点和终点坐标画直线 * * @param x0 起点x坐标 * @param y0 起点y坐标 * @param x1 终点x坐标 * @param y1 终点y坐标 */ this.line = function(x0, y0, x1, y1) { line_DDA(x0, y0, x1, y1); } /** * 用中点Bresenham法画圆 * * @param x 圆心x坐标 * @param y 圆心y坐标 * @param r 圆的半径 */ function circle_MidBresenham(x, y, r) { var px, py, d; px = 0; py = r; d = 1 - r; while (px < py) { self.point(x + px, y + py); self.point(x + py, y + px); self.point(x - px, y + py); self.point(x + py, y - px); self.point(x + px, y - py); self.point(x - py, y + px); self.point(x - px, y - py); self.point(x - py, y - px); if (d < 0) d += 2 * px + 3; else { d += 2 * (px - py) + 5; py--; } px++; } } /** * 用给定的圆心坐标和半径画圆 * * @param x 圆心x坐标 * @param y 圆心y坐标 * @param r 圆的半径 */ this.circle = function(x, y, r) { circle_MidBresenham(x, y, r); } /** * 用中点Bresenham法画椭圆 * * @param x 圆心x坐标 * @param y 圆心y坐标 * @param a 长半轴长度 * @param b 短半轴长度 */ function MidBresenhamEllipse(x, y, a, b) { var px, py; var d1, d2; px = 0; py = b; d1 = b * b + a * a * (-b + 0.25); self.point(x + px, y + py); self.point(x - px, y - py); self.point(x - px, y + py); self.point(x + px, y - py); while (b * b * (px + 1) < a * a * (py - 0.5)) { if (d1 <= 0) { d1 += b * b * (2 * px + 3); px++; } else { d1 += b * b * (2 * px + 3) + a * a * (-2 * py + 2); px++; py--; } self.point(x + px, y + py); self.point(x - px, y - py); self.point(x - px, y + py); self.point(x + px, y - py); } d2 = b * b * (px + 0.5) * (px + 0.5) + a * a * (py - 1) * (py - 1) - a * a * b * b; while (py > 0) { if (d2 <= 0) { d2 += b * b * (2 * px + 2) + a * a * (-2 * py + 3); px++; py--; } else { d2 += a * a * (-2 * py + 3); py--; } self.point(x + px, y + py); self.point(x - px, y - py); self.point(x - px, y + py); self.point(x + px, y - py); } } /** * 用给定的圆心坐标和长短半轴画椭圆 * * @param x 圆心x坐标 * @param y 圆心y坐标 * @param a 长半轴长度 * @param b 短半轴长度 */ this.ellipse = function(x, y, a, b) { MidBresenhamEllipse(x, y, a, b); } /** * 将缓存中的图像显示到画板上,并清空缓存 */ this.paint = function() { canvas.innerHTML += cache.join("");; cache = []; } } })();
评论
10 楼
greatghoul
2012-08-28
alvin198761 写道
你在例子运行的时候,删一个hta文件试试
倒是没有试过在运行时删除hta文件,应该是可以直接删除的,因为以前有人用 HTA 做的软件开发了自动更新的功能,通过ajax方法读取更新后的文件,覆盖旧版本的文件,然后刷新 HTA ,便是新版本了.
不过 HTA 虽然有很多东西可以用,权限也高,但是不能跨平台.豆瓣有一个叫做 onering 的东西,有比较好的跨平台能力,但是发布后,几乎都没有怎么更新.
如果能够 HTML5 和现在性能越来越好的 javascript 或者一些其它的脚本语言,兴趣真有不小的玩头.
9 楼
alvin198761
2012-08-28
greatghoul 写道
caowei3047 写道
hta文件好强啊。
这个例子其实并没有表现出hta的什么特性。
你在例子运行的时候,删一个hta文件试试
8 楼
alvin198761
2012-08-28
强大到没怎么看到,然后,不会用你这个东西做点事情
7 楼
mahu456
2011-06-30
很厉害!学习!
6 楼
louis0911
2011-05-03
太强大了!!!!!学习中
5 楼
effort_fan
2010-11-28
学习了。hta学习一下。
4 楼
taote
2010-11-02
MidBresenham 多谢
3 楼
jarry-li
2010-06-13
2 楼
greatghoul
2010-05-28
caowei3047 写道
hta文件好强啊。
这个例子其实并没有表现出hta的什么特性。
1 楼
caowei3047
2010-05-27
hta文件好强啊。
发表评论
-
python发送文件夹内容到邮箱
2012-02-07 00:48 2898由于我经常需要备份文件夹下的内容到邮件里面,每个打开邮件,上传 ... -
Cognos开发笔记
2012-02-07 00:43 1835前一段时间,完成了 ... -
python批量转换文件编码
2012-02-07 00:38 3165via: http://www.g2w.me/2012/02/ ... -
VIM中移动选中内容到备份文件
2012-02-07 00:33 1258在公司跟踪自己的工作计划时,我使用的 gtd 工具是 vim ... -
yuser
2011-06-08 18:19 0// ==UserScript== // @name ... -
Python的妙用,不解释
2011-06-02 17:32 1457import base64 filelist = [ ... -
config.js
2011-06-02 17:31 0写道 U0VSVkVSID0gJ1xcXFwxMC4xND ... -
util.js
2011-06-02 17:30 0写道 Ly8g5qih5p2/5YyW5a2X56ym5L ... -
teamtalk.js
2011-06-02 17:29 0写道 KGZ1bmN0aW9uKCkgewogICAgdm ... -
TeamTalk.hta
2011-06-02 17:28 0写道 PGh0bWw+CjxodGE6YXBwbGljYX ... -
JavaScript目录遍历
2011-05-20 17:18 0// 代码行数统计工具 var fso = new Ac ... -
巧用Scanner读取输入流中的所有内容
2011-05-18 14:51 1345URL url = new URL("http:// ... -
python备份表
2011-05-06 16:18 0import pyodbc import os impor ... -
Python DataViewListCtrl用法
2011-05-06 16:15 0import wx.dataview as dv sel ... -
python 对非规范化json的处理
2011-05-06 16:11 0json 格式: [{name: '浪人情歌', autho ... -
encode py
2011-04-01 17:32 0import base64 import os ... -
HTA无标题窗口拖动
2011-03-23 10:57 0var moveing = false,x,y; tit ... -
python db manager
2011-03-22 20:03 0#!/usr/bin/env python # coding: ... -
pyodbc with statement
2011-03-09 20:53 0class DataProvider(object): ... -
fdsafdsa
2011-03-03 17:43 0#!/usr/bin/env python # coding ...
相关推荐
用vml画饼状图用vml画饼状图用vml画饼状图用vml画饼状图
SVG、CANVAS、VML比较,有利于各位IT大神学习,在学习画图方面的提高。
我们甚至可以在 IE 中使用 <canvas> 标记,并在 IE 的 VML 支持的基础上用开源的 JavaScript 代码(由 Google 发起)来构建兼容性的画布。 参见: 目前<canvas> 已经成为 HTML 5 中一个正式的标签。
vml实现圆角表格,非常实用
VML经典教程; 内含自己写的VML实例,能用鼠标动态画圆、画矩形、画多边形,希望对大家有所帮助。
VML入门教程,其中包含用javascript生成VML代码绘图等代码。
vml+javascript直接在浏览器中绘制动态曲线图实例(源码-+Think+in+vml++vml+极道教程)
javaScript报表使用VML技术,适用于IE内核的浏览器
vml js javascript使用教程
vml学习,提供vml的报表视图展示,有共同爱好者共同成长
VML图像画版,用VML画图,生成VML代码
vml+javascript直接在web页面绘制动态曲线
Javascript + VML + SVG 工作流设计器
Vml画板工具 比较牛vML在线画图工具
HTML5 canvas 元素的出现填补了这种不足,开发人员可以使用 JavaScript 脚本语言在 canvas 中进行一系列基于命令的图形绘制操作,本文将通过讲解如何使用 canvas 元素进行基本绘图操作,以及完成简单的动画和用户...
vml+javascript直接在浏览器中绘制动态曲线图实例
用javascript+ajax+vml生成折线图javascript类打包
VML图片编辑剪裁类,可以在原始图片上进行各种绘制,如图片、文字、长方形、正方形等,还可以支持形状的3D效果,基于javascript+VML,剪裁后可以看到剪裁后的图片保存效果,文件为VS2005项目,附完整演示例子,其他...
用VML+JavaScript写的一个通用统计图表-with VML JavaScript write a definitive statistical charts