咖啡伴侣

IE下 eval 内存泄漏

下面2段代码是测试代码，IE9下测试
都有泄漏，非IE浏览器没问题。困惑

每秒eval，400个方法调用；200多K的内存泄漏，

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>eval 测试</title>
        <script>

    var afunction = function(_name,_mask){
         return false;
    }

    var bfunction = function(_color){
    }

    var cfunction = function(_color){
    }

var _action = function(){

    for(var i=0;i<40;i++){


         var _script = "if(afunction('111','222')) bfunction('0xCDCD00'); else if(afunction('111','222')) bfunction('0xCDCD00'); else if(afunction('111','222')) bfunction('0xCDCD00'); else if(afunction('111','222')) bfunction('0xCDCD00'); else if(afunction('111','222')) bfunction('0xCDCD00');";
         _script += "if(afunction('222','333')) cfunction('0xCDCD00'); else if(afunction('222','333')) cfunction('0xCDCD00');  else if(afunction('222','333')) cfunction('0xCDCD00'); else if(afunction('222','333')) cfunction('0xCDCD00'); else if(afunction('222','333')) cfunction('0xCDCD00');";
         var _func = new Function(_script);
          _func();

    }

}

window.onload = function() {
    setInterval(_action,1000);
};

</script>

    </head>
    <body>

    </body>
</html>

2.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>eval 测试</title>
        <script>

var _action = function(){

    var afunction = function(_name,_mask){
         return false;
    }

    var bfunction = function(_color){
    }

    var cfunction = function(_color){
    }

    for(var i=0;i<40;i++){
         var _script = "if(afunction('111','222')) bfunction('0xCDCD00'); else if(afunction('111','222')) bfunction('0xCDCD00'); else if(afunction('111','222')) bfunction('0xCDCD00'); else if(afunction('111','222')) bfunction('0xCDCD00'); else if(afunction('111','222')) bfunction('0xCDCD00');";
         _script += "if(afunction('222','333')) cfunction('0xCDCD00'); else if(afunction('222','333')) cfunction('0xCDCD00');  else if(afunction('222','333')) cfunction('0xCDCD00'); else if(afunction('222','333')) cfunction('0xCDCD00'); else if(afunction('222','333')) cfunction('0xCDCD00');";
         eval(_script);
    }

}

window.onload = function() {
    setInterval(_action,1000);
};

</script>

    </head>
    <body>

    </body>
</html>

posted @ 2012-08-15 16:53 oathleo 阅读(1722) | 评论 (1) | 编辑收藏

浏览器开发canvas

HTML5的canvas需要firefox, safari, chrome, opera或者IE9. 对低于9的IE版本，该游戏使用ExplorerCanvas库来模拟，虽然视觉效果差一些但也可以使用．简单写写canvas兼容低版本(<９)IE的经验．

Canvas是HTML5新增加的元素, 可以方便的画图. Firefox, safari, chrome, opera的最近版本以及IE9都支持. IE8及以下不支持HTML5, 但是ExplorerCanvas库(http://excanvas.sourceforge.net/)调用IE内部功能提供了几乎相同的API. ExplorerCanvas不支持字体, 所以为了使用文字, 还需要使用canvas-text库(http://code.google.com/p/canvas-text/).

使用ExplorerCanvas及canvas-text, 需要在HTML header里包括:
<script type="text/javascript" src="javascript/excanvas/excanvas.js"></script>
<script type="text/javascript" src="javascript/excanvas/canvas.text.js"></script>
<script type="text/javascript" src="javascript/excanvas/faces/optimer-normal-normal.js"></script>

如果同一页HTML要兼容低版本IE和其它支持HTML5的浏览器, 可以用如下的语法选择性加入低版本IE需要的部分:


下面的部分包括在HTML的BODY里, canvas元素的后面:
 <script type="text/javascript" src="javascript/mycode.js"></script> 


下面是mycode.ie.js不同于mycode.js的部分.

1. addEventListener -> attachEvent
别的浏览器用addEventListener. IE用attachEvent. 对于事件名, IE要多加一个"on". 比如IE用"onmousedown", 别的浏览器用"mousedown".

2. 为了兼容手机, 鼠标事件为触屏事件取代, 所以mousedown/mouseup/mousemove改用如下的事件: touchstart/touchend/touchmove.

3. event.pageX -> pageX(event)
别的浏览器直接用event.pageX. IE完全不同, 所以另外自定义一个函数pageX(event)来达到相同效果:
function pageX(e) {
if (e.pageX) return e.pageX;
else if (e.clientX)
return e.clientX + (document.documentElement.scrollLeft ?
document.documentElement.scrollLeft : document.body.scrollLeft);
else return null;
}

4. in event handlers, this.offsetLeft/Top -> vCanvas.offsetLeft/Top
别的浏览器this指代事件发生的元素, 这里是canvas. IE的this指代window, 所以要专门指明vCanvas.offsetLeft/Top.

5. onmouseout在IE里行为不稳定, 所以应避免使用, 或者改用onmouseleave.

6. 辨认鼠标的左右键, 别的浏览器用event.which, IE用event.button.

7. DIV元素的半透明效果，别的浏览器用 style="background-color:rgba(255,255,255,0.75);", IE用style="background-color: white; opacity:0.75;filter:alpha(opacity=75);"

8. 定义元素高度和宽度时，IE常要指明单位px，别的浏览器不用. 比如:

<table id="Toolbar" border="0" cellpadding="2" cellspacing="0" bgcolor="#ffffff" style="font-size:12px; width:320;">




9. 另外IE引擎慢一些, 所以别的浏览器里运行流畅的canvas事件, 在IE里要简略一些来保证运行速度.

posted @ 2012-08-10 11:52 oathleo 阅读(481) | 评论 (0) | 编辑收藏

html5 canvas 在不同浏览器下效率

1.目前使用全刷策略，即每秒全刷整张图(xml格式)，复杂图形通讯量在30K左右（gzip压缩），桌面浏览器：FF、Google Chrome 运行CPU占用3%左右

2.移动设备测试效果同1

3.桌面IE8下使用excanvas插件，可以打开看但效率很低，无法实现秒级刷新（IE9下效果未知）

使用canvas已可开发出非IE浏览器实时图形，适合桌面和移动系统

桌面IE8及以下，仍然没有高效的图形展示方案

如客户端局部刷新，应该能提高通讯、展示效率，但大大提升开发难度，但如想IE8下实现秒级刷新，估计只能依靠优秀的局部刷新技术来实现

2

posted @ 2012-08-03 08:56 oathleo 阅读(1095) | 评论 (0) | 编辑收藏

canvas draw椭圆

1.canvas draw椭圆通过 scale
2.arc 前必须beginPath

canvas_context.save();
        canvas_context.scale(1, _scale);
        canvas_context.beginPath();
        canvas_context.arc(_centerX, _centerY, parseInt(_bounds[2] * 0.5), 0,(Math.PI/180)*360, true);

        canvas_context.restore();

posted @ 2012-07-31 10:21 oathleo 阅读(821) | 评论 (0) | 编辑收藏

读取visio文件

visio本身的格式不用浪费时间了，太复杂，即使是它明文的，读起来也是吃力的要命

所以嘛，绕着来，visio可以转svg，svg这么通用的格式，就好读取多了，可以自己读，也可以找第三方

这里使用最常见的batik，读的真心不错！自己再从batik里面读取，方便多了

因为是公司的东西，所以只能发点截图了

visio原图

读取batik里的对象，再转格式后展示的效果

posted @ 2012-03-23 16:54 oathleo 阅读(2004) | 评论 (0) | 编辑收藏

仿射变换

仿射变换可以理解为

・对坐标进行放缩，旋转，平移后取得新坐标的值。

・经过对坐标轴的放缩，旋转，平移后原坐标在在新坐标领域中的值。

如上图所示，XY坐标系坐标轴旋转θ，坐标原点移动（x0，y0）。

XY坐标系中的坐标（X，Y），则求新坐标系xy中的坐标值的方程组为:

X = X･cosθ - Y･sinθ + x0

Y = X･sinθ + Y･cosθ + y0

写成矩阵形式为

| x | | cosθ sinθ | | x0 |

| | = | X Y | * | | + | |

| y | | -sinθ cosθ | | y0 |

为将原点移动的值放入矩阵，则可以加入一个不影响原方程组的解的冗余方程。于是可以写成

X = X･cosθ - Y･sinθ + x0

Y = X･sinθ + Y･cosθ + y0

1 = X･0 + Y･0 + 1

写成矩阵形式为

| x | | cosθ sinθ 0|

| y | = | X Y 1 | * | -sinθ cosθ 0|

| 1 | | x0 y0 1|

这个矩阵就是Helmert变换矩阵。

考虑到新坐标系对于原坐标系在x，y两个坐标轴上的放缩率，可分别表示为λx和λy，则Helmert变换方程组可以修改为

X = (λx)X･cosθ - (λy)Y･sinθ + x0

Y = (λx)X･sinθ + (λy)Y･cosθ + y0

同样按照前述方法写成三阶矩阵为

| x | | (λx)cosθ (λx)sinθ 0|

| y | = | X Y 1 | * | (λy)-sinθ (λy)cosθ 0|

| 1 | | x0 y0 1|

这个矩阵就是affine变换矩阵，仿射矩阵。

posted @ 2011-12-20 11:21 oathleo 阅读(390) | 评论 (0) | 编辑收藏

防止utils类/tool等被实例化

abstract 该类

posted @ 2011-12-12 16:57 oathleo 阅读(254) | 评论 (0) | 编辑收藏

年终奖

12月4日傍晚，中国农业大学经济管理学院副教授葛长银发了一条微博，“请大家注意年终奖临界点，宁可少千元不要超一元”，并举出例子，
比如年终奖为 18000元，那么要缴纳540元的税，
如果按年终奖为18001元，则需要多纳税1155.1元，即1695.1元。
同理，54001元的年终奖比 54000元多纳4950.2元；
发108001元比108000元多纳24390.25元；
发420001元比420000元多纳19250.3元；
发 660001元比660000元多纳30250.35元；
发960001元比960000元多纳88000.45元。

posted @ 2011-12-07 13:52 oathleo 阅读(305) | 评论 (1) | 编辑收藏

遇到1个问题，解决一个问题

1.遇到的问题：flex全屏下，使用

http://www.blogjava.net/oathleo/archive/2011/11/29/365125.html

的方法，无法解决右键菜单自定义了

2.解决的问题
flex里使用了flex ---》eval js ---》回调flex对象注册方法
其中js回调 flex对象上注册方法时
IE下可以直接使用 objectID.方法名来调用，FF下不行

原来FF下是使用document.getElementById('"+ objectID +"') 来找到flex对象的，IE也兼容该方法

posted @ 2011-12-05 17:09 oathleo 阅读(1457) | 评论 (2) | 编辑收藏

导航

公告

常用链接

留言簿(5)

随笔分类

随笔档案

文章分类

文章档案

搜索

最新评论

阅读排行榜

评论排行榜