草庐IT

canvas2d

全部标签

javascript - HTML5 游戏 (Canvas) - UI 技术?

我正在使用PhoneGap为移动设备(Android/iPhone/WebOS)构建一个JavaScript/HTML5游戏(使用Canvas)。我目前正在尝试设计UI和播放板应该如何构建以及它们应该如何交互,但我不确定最好的解决方案是什么。这是我能想到的-使用drawImage和fillText等工具将UI构建到Canvas中使用常规DOM对象在Canvas外部构建部分UI,然后在UI元素需要与游戏板Canvas重叠时在Canvas上float一个div。是否还有其他我没有想到的可用于构建游戏UI的技术?此外,其中哪些将被视为“标准”方式(我知道HTML5游戏不是很流行,所以可能还没

javascript - HTML5 游戏 (Canvas) - UI 技术?

我正在使用PhoneGap为移动设备(Android/iPhone/WebOS)构建一个JavaScript/HTML5游戏(使用Canvas)。我目前正在尝试设计UI和播放板应该如何构建以及它们应该如何交互,但我不确定最好的解决方案是什么。这是我能想到的-使用drawImage和fillText等工具将UI构建到Canvas中使用常规DOM对象在Canvas外部构建部分UI,然后在UI元素需要与游戏板Canvas重叠时在Canvas上float一个div。是否还有其他我没有想到的可用于构建游戏UI的技术?此外,其中哪些将被视为“标准”方式(我知道HTML5游戏不是很流行,所以可能还没

html - 小数字体大小 html5 Canvas ?

我对不同浏览器如何在HTML5Canvas上呈现字体大小有疑问。特别是字体大小不是整数的地方。例如“8.5px宋体”、“2.23em宋体”等。forcanvas.font=FontSize+"pxArial";其中FontSize是(8.1,8.2,8.3,...)我希望得到一个线性结果,但是唯一一致存档的浏览器是IE!(我知道)。Firefox在11.2px以下四舍五入,但超过11.2px是线性的。Chrome和Safari仅将字体缩放为整数值。舍入规则似乎设置为像素并向下舍入到最接近的小于.5的整数我的Canvas应用程序正在执行一些程序化的动画转换(缩放和平移)试图避免Canva

html - 小数字体大小 html5 Canvas ?

我对不同浏览器如何在HTML5Canvas上呈现字体大小有疑问。特别是字体大小不是整数的地方。例如“8.5px宋体”、“2.23em宋体”等。forcanvas.font=FontSize+"pxArial";其中FontSize是(8.1,8.2,8.3,...)我希望得到一个线性结果,但是唯一一致存档的浏览器是IE!(我知道)。Firefox在11.2px以下四舍五入,但超过11.2px是线性的。Chrome和Safari仅将字体缩放为整数值。舍入规则似乎设置为像素并向下舍入到最接近的小于.5的整数我的Canvas应用程序正在执行一些程序化的动画转换(缩放和平移)试图避免Canva

javascript - HTML5 - 调整 Canvas 大小时图像质量差

我正在制作和上传带有客户端图像大小调整的页面(使用HTML5Canvas)。一切正常,但问题是图像质量不是很好。Hereisalink到一个(正在进行的)照片库,其中包含我的调整大小/上传代码生成的图像。你能明白我所说的质量差是什么意思吗?很多锯齿状的边缘,尤其是在缩略图上。关于如何解决此问题的任何想法?这是我用于生成缩略图的javascript:img.onload=function(){varcanvasWidth=150;varcanvasHeight=150;varRz=resizeCanvasSmall(img,canvasID,canvasWidth,canvasHeigh

javascript - HTML5 - 调整 Canvas 大小时图像质量差

我正在制作和上传带有客户端图像大小调整的页面(使用HTML5Canvas)。一切正常,但问题是图像质量不是很好。Hereisalink到一个(正在进行的)照片库,其中包含我的调整大小/上传代码生成的图像。你能明白我所说的质量差是什么意思吗?很多锯齿状的边缘,尤其是在缩略图上。关于如何解决此问题的任何想法?这是我用于生成缩略图的javascript:img.onload=function(){varcanvasWidth=150;varcanvasHeight=150;varRz=resizeCanvasSmall(img,canvasID,canvasWidth,canvasHeigh

jquery - 动画选项 HTML5 Canvas/CSS3/jQuery

我有兴趣用HTML5/JQuery或HTML5/JQuery的组合制作一些更像flash的动画。其中一个流行的想法是飞鸟、Angular色动画和类似“补间”的动画序列。我是一名Flash开发人员,所以通过Flash的基于时间轴的动画补间系统,所有这些都是第二天性,所以我想知道HTML5Canvas、CSS3和jQuery等新兴技术有什么可能?这些补间动画有多熟练?什么是阅读的好起点?例如http://www.thewildernessdowntown.com/处的飞鸟太神奇了,它们看起来是3d,可变方向,速度,旋转,襟翼,速度。在Flash中可以相对轻松地实现这一点,将场景动画创建为动

jquery - 动画选项 HTML5 Canvas/CSS3/jQuery

我有兴趣用HTML5/JQuery或HTML5/JQuery的组合制作一些更像flash的动画。其中一个流行的想法是飞鸟、Angular色动画和类似“补间”的动画序列。我是一名Flash开发人员,所以通过Flash的基于时间轴的动画补间系统,所有这些都是第二天性,所以我想知道HTML5Canvas、CSS3和jQuery等新兴技术有什么可能?这些补间动画有多熟练?什么是阅读的好起点?例如http://www.thewildernessdowntown.com/处的飞鸟太神奇了,它们看起来是3d,可变方向,速度,旋转,襟翼,速度。在Flash中可以相对轻松地实现这一点,将场景动画创建为动

使用预训练的2D扩散模型改进3D成像

扩散模型已经成为一种新的生成高质量样本的生成模型,也被作为有效的逆问题求解器。然而,由于生成过程仍然处于相同的高维(即与数据维相同)空间中,极高的内存和计算成本导致模型尚未扩展到3D逆问题。在本文中,作者将传统的基于模型的迭代重建的思想与扩散模型结合,从而产生了一种高效的方法来提高3D医学图像重建任务,如稀疏视图断层扫描(sparse-viewtomography),有限角度断层扫描(limitedangletomography),压缩感知MRI(compressedsensingMRI),这些任务从预训练的2D扩散模型受益。从本质上讲,作者提出,在测试时的剩余方向上使用基于模型的先验来增强2

javascript - HTML5 - 为 Canvas 创建视口(viewport)

我有一个二维数组,横跨30,向下20。但是,视口(viewport)仅绘制15个横向和10个向下。我最初有一个这样的游戏,我一直在努力实现这样的目标:这是我的fiddle:http://jsfiddle.net/sTr7q/ 最佳答案 我在这里为您制作了一个基本的视口(viewport):http://jsfiddle.net/kmHZt/您必须跟踪表示您在整个世界中所处位置的视口(viewport)X和Y(vX,vY)。我还将视口(viewport)宽度和高度保留为变量,而不是将它们硬编码。您可以使用箭头键更改视口(viewpor