Tag: html5 canvas

给出错误图像的所选区域的图像的平均颜色

我试图找到图像某些部分的平均颜色,然后将其设置为背景。 我正在使用此颜色来查找所选区域的平均代码。 JSFiddle代码查找平均图像颜色。 我想从图像中提取该部分并找到平均颜色,然后将其设置为背景图像 这是我正在使用的代码 var rgb = getAverageRGB(document.getElementById(‘i’)); document.body.style.backgroundColor = ‘rgb(‘ + rgb.r + ‘,’ + rgb.g + ‘,’ + rgb.b + ‘)’; function getAverageRGB(img) { var canvas = document.createElement(‘canvas’), context = canvas.getContext && canvas.getContext(‘2d’), rgb = {r:102,g:102,b:102}, // Set a base colour as a fallback for non-compliant browsers pixelInterval = 5, // Rather […]

html5 canvas filltext与sketch.js一起消失

我的HTML5 canvas元素有问题。 我使用sketch.js,以便客户端可以在网页中制作图纸。 客户要求之一是他可以添加带有数字的“邮票”。 所以我对JS进行了一些修改以使其成为可能。 它有效,可以添加邮票。 但是当用户切换回钢笔工具并再次开始绘图时,数字会消失。 我使用fillText()添加标记 $.sketch.tools.text = { onEvent: function(e) { switch (e.type) { case ‘mousedown’: case ‘touchstart’: this.context.font=”16px Verdana”; this.context.fillText(this.stamp, e.pageX – this.canvas.offset().left, e.pageY – this.canvas.offset().top); break; } return true; }, draw: function(action) { return true; } }; 在这里查看演示: http : //jsfiddle.net/brixion/m5dpwvx5/2/ 希望有人可以帮助我

htmlcanvas冻结动画

我正在寻找使用这个插件。 在我的版本中,我会有雪,一旦用户擦除了50%的canvas我想再次出现雪(canvas)的部分,好像它再次冻结,但像有人吹热风一样减速在上面。 http://minimal.be/lab/jQuery.eraser/ 有没有办法实现这一目标?

如何在javascript中从canvas中删除文本

我的问题是,当我点击按钮时,调用的callfunction()方法和计数器增加5,当我再次点击计数器增加5并在给定位置显示10我的问题是当计数器增加前一个数字不是擦除并显示前一个数字上的递增数字。我想删除之前的数字并显示下一个递增的数字。 我有以下代码 var count=0; function callfunction() { context.fillText(count,200,200); count = count+5; //context.fillText(“”,200,200); }

如何为canvas周围的箭头设置动画

我正在尝试使用JQuery在canvas中设置箭头动画。 箭头应该随机旋转在canvas上移动,但我不知道该怎么做。 有谁知道怎么做?

跨浏览器光标图像的标准大小? jquery更改光标图像

我的光标图像正在保存128px x 128px pngs,但现在它们不在任何浏览器中:(做了一些改变?我几天前发布了一个问题,关于我的光标图像没有因为我的绘图应用程序的onclick而改变。我得到了我最初的问题的帮助,你可以看到它在控制台中被正确调用,一切都很好,但图像不会从画笔图像中改变。我认为它可能与尺寸有关,但我不是100%肯定。任何帮助将不胜感激: *************** HTML ************************* ************************** JS *********************** ******** $(‘.tools table tr th div’).each(function() { $(this).click(function () { console.log($(this).attr(‘id setCursor($(this).attr(‘id’)); }); }); function setCursor(id) { console.log(“init.jsCursor(): id: ” + id); switch (id) { case ‘brush’: shape = SHAPE_TYPE.LINE; break; case ‘eraser’: shape = SHAPE_TYPE.ERASER; break; case ‘fill’: shape = SHAPE_TYPE.FILL; break; } console.log(“image: […]

在形状内绘制角度弧

我有四分。 它的拖拉机。 在任何一点我点击“绘制”按钮我想显示角度。 我试过但它会在外面画出陡峭的角度。 但我想在任何一点绘制形状内的弧。 $(document).ready(function () { var c = document.getElementById(‘canvas’); var ctx = c.getContext(“2d”); var a1 = parseInt($(“#p1”).css(“left”)) – 5; var a2 = parseInt($(“#p1”).css(“top”)) – 5; var b1 = parseInt($(“#p2”).css(“left”)) – 5; var b2 = parseInt($(“#p2”).css(“top”)) – 5; var c1 = parseInt($(“#p3”).css(“left”)) – 5; var c2 = parseInt($(“#p3”).css(“top”)) – 5; var d1 = […]

使用javascript交换带有canvas元素的div

我有2个div。 每个div都有一个canvas元素。 在我的程序开始时,我在canvas上放了一个图像。 图像不同。 然后我尝试使用交换div var contentofmyfirstdiv = $(‘#myfirstdiv’).html(); var contentofmyseconddiv = $(‘#myseconddiv’).html(); $(‘#myseconddiv’).html(contentofmyfirstdiv); $(‘#myfirstdiv’).html(contentofmyseconddiv) ; 所有作品除了每个canvas都是空的。 似乎“contentof ……”没有从canvas中获取图像……任何人都知道如何交换canvas的内容? 我正在使用Firefox。

如何使用jquery / html5 / php在图像上放置一些文本并使用文本保存图像

嗨我正在做一个与生成贺卡有关的小任务我需要选择一个图像并从提供文本中选择一个文本我需要将所选文本放在图像上并保存并发送给用户,我想要在html5,jquery,php中做到这一点。 有什么建议

在asp.net中回发后,HTML5canvas得到了刷新

我在我的asp.net应用程序中使用HTML5 canvas标签和Jquery插件进行免费手写。 http://www.websanova.com/plugins/paint/html5#websanova 我面临一个问题。 单击“我的服务器端”按钮以保存图像时,我会进行回发操作,并刷新页面的canvas。 回发后它给我空canvas,我得到了通过代码保存的空白图像。 这是我的代码片段 .::wPaint in .NET::. $(“#wPaint”).wPaint(); function loadImage() { var imagedata = $(“#lblImage”).text(); var extension = $(“#lblextension”).text(); $(“#wPaint”).wPaint(“image”, “data:image/” + extension + “;base64,” + imagedata + “”); } function saveImage() { var imageData = $(“#wPaint”).wPaint(“image”); $(“#lblImage”).text(imageData); } function Clear() { $(“#wPaint”).wPaint(); } ::::::::::: CS :::::::::::::::: using System; using System.Collections.Generic; using […]