canvas

Draw 2 bezier curves through 3 points to mimic a circle arc

我们两清 提交于 2019-12-24 11:38:03
问题 I have three points that are not on the same line, originally I want to draw a circle arc through these three points, which I did. But chrome is actually not drawing real circle but using several bezier curves to pretend it is circle, because bezier curves are cheap. If chrome is doing that as a middle man, why ain't I drawing circle-like bezier myself (two bezier, from point 1 to middle point, middle point to point 3)? That would be much cleaner, and cheap ( 2 compared to unknown number of

Converting YUV to YUV420 Android onPreview

我的未来我决定 提交于 2019-12-24 11:35:53
问题 a)I was wondering what is the difference between YUV and YUV420? b)I want to use the raw frames from Camera and convert them into YUV420 in real time. What is the fastest way to do this? I used bitmap factory to convert from yuv to jpg and I used onDraw() method to draw the bitmap. However, this takes some time to process. What is the best alternative to do the conversion if I want converting from YUV to YUV420? 回答1: I found a very straight forward way to convert from NV12 to YV12/YUV 420.

Positioning overlapping canvas

喜你入骨 提交于 2019-12-24 11:34:23
问题 I've got a page that is supposed to display a line graph. There is a title at the top, the graph in the middle, then a table below them. It is laid out roughly like this: <div> <h1>Title</h1> </div> <div> <canvas1></canvas> <canvas2></canvas> </div> <div> <table></table> </div> Right now each of the 'div' blocks are staying separate from each other, which is good. However, the two canvas's, despite having different z-index values, are next to each other instead of stacking on top. I've read

Modify a canvas using fabric.js without removing existing content

瘦欲@ 提交于 2019-12-24 11:19:18
问题 In my web page there is a canvas with some content and this content is rendered separately (without using fabric.js). What I want to do is add some content on top of the existing content, using fabric.js . I tried to do that as follow (sample code), var canvas = new fabric.Canvas('c'); var path = new fabric.Path('M 0 0 L 200 100 L 170 200 z'); path.set({ left: 120, top: 120 }); canvas.add(path); But it will remove the existing content from the canvas. Could you please help me on this? 回答1:

Javascript load images in canvas with JCanvaScript

[亡魂溺海] 提交于 2019-12-24 11:08:32
问题 I am using JcanvaScript library to work with Html5 canvas and now I want to load some images in my Canvas, but only last image loading is successful, I can't see any other images but the last one and I don't know what is wrong with my code. here is the code <!DOCTYPE HTML> <html> <head> <style> canvas { border: 1px solid #9C9898; } </style> <script src="jcanvas/jCanvaScript.1.5.15.js"></script> <script> var imagesUrl = []; var imagesObj = []; var canvasWidth = 800; var canvasHeight = 600; var

Fabricjs Selection on multiple objects on mouse click

99封情书 提交于 2019-12-24 10:20:24
问题 Any suggestion on select multi objects on canvas mouse click? not all object, I want to select objects that overlay on the point. For my knowledge, the target on mouse event is always the top most object only. I had tried to bind event on object, but it wont fired for those at the back side. I had tried select based on item size and height, but it is not working perfectly after rotate. var canvas = this.__canvas = new fabric.Canvas('c', { enableRetinaScaling: false }); function LoopOnObjects

Problems with superscript using Python tkinter canvas

萝らか妹 提交于 2019-12-24 09:57:24
问题 I am trying to use canvas.create_text(...) to add text to a drawing. I have been somewhat successful using unicode in the following way: mytext = u'U\u2076' #U^6 canvas.create_text(xPos,yPos,text = mytext, font = ("Times","30") canvas.pack() It works, but when increasing the font size, superscripts 4,5,6,7,8,9,0 do not increase in size. Only 1,2,3 work. I'm assuming it's the same for subscripts. Also, when I save the canvas as a postscript, the problem superscripts are gone...but when I print

Javascript Canvas Element - Array Of Images

不羁岁月 提交于 2019-12-24 09:54:24
问题 I'm just learning JS, trying to do things without jQuery, and I want to make something similar to this however I want to use an array of images instead of just the one. My image array is formed like this var image_array = new Array() image_array[0] = "image1.jpg" image_array[1] = "image2.jpg" And the canvas element is written like this. (Pretty much entirely taken from the Mozilla site) function draw() { var ctx = document.getElementById('canvas').getContext('2d'); var img = new Image(); img

Debugger ignores previous function call

寵の児 提交于 2019-12-24 09:49:47
问题 I have this bouncing/colliding balls animation and currently I'm debugging collision detection. To be more precise, I'm trying to prevent balls from intersecting during the collision. I wanted to stop the animation the moment balls collide and I can do that, but if I also want to draw the collision of the balls before stopping the execution, I need to draw them first. firstBall.move(); secondBall.move(); Ball.detectCollisions(balls); // execution stops here before the balls are drawn

Debugger ignores previous function call

孤者浪人 提交于 2019-12-24 09:43:27
问题 I have this bouncing/colliding balls animation and currently I'm debugging collision detection. To be more precise, I'm trying to prevent balls from intersecting during the collision. I wanted to stop the animation the moment balls collide and I can do that, but if I also want to draw the collision of the balls before stopping the execution, I need to draw them first. firstBall.move(); secondBall.move(); Ball.detectCollisions(balls); // execution stops here before the balls are drawn