I want to find a way to make possible to draw on the entire browser page or a part of it using the mouse pointer. It will be just a blue line that it will be created when the button is clicked.
Is there any technology instead of Flash?
Thank you
Take a look at this. It was the first result on Google when searching for JavaScript Painting. It's a step-by-step guide on how to use the JavaScript canvas to create a drawing tool.
http://dev.opera.com/articles/view/html5-canvas-painting/
Related
I was recently trying out Brython and I'm having trouble figuring out how to draw a simple rectangle to a canvas.I can only find very complex examples of drawing to a canvas that don't work for me and I was unable to find a clear answer in the docs.
Could someone reading this please show me a bare-bones way of drawing a simple shape to a canvas with Brython and or show me something to get me on the right track?
You have some examples based on a library called brython-bryplot in this IPython/jupyter notebook (it uses a magic function called brythonmagic).
You could use directly the brython-bryplot library or you can have a look at the base.py module to check how shapes and text are implemented.
If you find any issues just let me know as I'm the developer of brython-bryplot, brythonmagic,... :-D
I want to create an undo button for my web application using javascript. Can someone please help. Basically i got an web app which has got features such as Drawing, Image effect, and Drag and Drop. These functionality are performed on one canvas. All i need is an #Undo button so that if i do a mistake i can go one step backwards. I cant use Jquery. I am looking for a pure javascript to implement that function.
You haven't given much info, so I'll make assumptions.
Assumption 1: all you user drawing interactions are recorded in an array.
If this is true then simply clear the canvas and redraw the interactions from the array to interactionArray.length -1;
Assumption 2: You're using multiple canvas.
If this is true, hide/remove the last (most top) canvas element.
If you're not using either of these methods, maybe look into these methods. Or give us more information on the the method you're currently using.
Note: There are certainly not the only methods to including an "undo" feature!)
Depends on your web application, but shouldn't this do?
<button type="reset">Click Me!</button>
or in js:
Reset Form
I'm trying to superpose two GwtCanvas (which use an Html5 canvas). I am able to get this effect by using an absolute panel. But by doing this, I can't get my object to fill my panel. I would like to this so I can do a whiteboard in GWT. So far, I'm pretty advance but I would like to have multiple canvas overlay to support undo or preview. For example, if we draw a rectangle, it would be good to preview it as we move the mouse. I have found a javascript tutorial to do this :
ex:
http://dev.opera.com/articles/view/html5-canvas-painting/
There is a javascript example, but I'm not sure how to do the bridge between GWT and JavaScript. Any ideas ?
I think you should go for GWT JSNI - This way you would be able to access your JS from GWT code. You can find more information about JSNI at the following location:
http://code.google.com/webtoolkit/doc/latest/DevGuideCodingBasicsJSNI.html
I am looking for something that will allow users to write out a signature in an HTML form. I am looking for something that will run locally on the machine so if it can be done through a javascript function or something else that would be great.
I have seen the canvas HTML5 object, but I haven't found any examples that work well with IE. I am continuing to look, but was just wondering if anyone knows of anythign else out there that will allow a user to write out a signature?
You could do that with Flex or Silverlight, if you're not averse to plugins.
Otherwise, the only way I can think of to do this would be to create a function that places a very small graphic of a 1 pixel dot over and over again at the point of the cursor when it is dragged with the mouse button depressed. (Depressing, eh?) The dots would replicate more profusely and create a thicker line where the cursor pauses, and make a thinner line as it moves faster. The dots would in any case be close enough together to appear as a line, the way halftone printing uses dots to make photographs appear in newspapers.
I could write this for you but you'd have to pay me. :)
not really 'anything else', but canvas can be made to work even in msie6 with google's excanvas (which maps canvas to vml iirc).
canvas painter does this, just successfully drew my signature in both ff3.6 and msie6, so that might make for a good starting point?
I'm looking for a way to create an interactive bullet graph, which will allow the user to click anywhere in the graph and set a marker, then calculate some simple values based on where this marker is at. For example, I'd like it to look similar to this:
http://www.usrecordings.com/test-lab/bullet-graph.htm
Yet, allow the user to click inside it and have it calculate values. I don't want the user limited to the axis values either, it should be able to figure out what the value is between them. Has this been done anywhere before or do I need to start something from scratch?
Flot may be able to do what you need.
Check out some of the examples, particularly the interactive one. It's open source, so you can add any functionality you need to it. This should be a good starting point.
HTML canvas is a great place to start. A brief google search showed there may not be many interactive charts available. These are a couple HTML canvas examples, the first being math, the second the w3c spec: Polynomials, HTML Canvas w3c. I've found that searching for HTML canvas game examples produce many more tutorials than straight HTML canvas examples. I don't know what your programming abilities are, so I'm giving you these links with the assumption you have javascript experience.
Have fun.
Oh and thanks for asking if it's been done before.