Drawing an image in html5 using javascript [closed] - javascript

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 6 years ago.
Improve this question
i currently want to implement a draw image tool to my projects(something like the brush tool but instead of a color i am actually drawing with the picture). I want to be able to "draw" a picture by hovering my mouse over it. I m currently thinking about two possibilities, one is with a mask over the picture and actually erasing the mask with the mouse or the other posibility to try to draw with the canvas, making the zones touched by the mouse visible.
Do you have some general ideas about how should i start my work?
Thanks

I would prefer the canvas approach.
Here is another great tutorial:
https://code.tutsplus.com/tutorials/how-to-create-a-web-based-drawing-application-using-canvas--net-14288

Related

Create Buttons from image in HTML [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 6 years ago.
Improve this question
I've got this interesting challenge here that I don't know how to solve. I'm trying to create HTML buttons from an Image. This image here is the example I am using. How can I split up all the trapezoids into separate buttons that register separately when tapped on the corresponding regions. I would assume I need to specify some kind of boundary for each trapezoid but I don't know how you would do that for a decently complex shape like this.
Use the HTML <map> element to create an image map from the image. Image maps allow you to map out shapes (circles, rectangles and irregular polygonal) from coordinates you provide and these shapes become clickable with their own hrefs. You are also able to get the x,y coordinates during the click event.
There are a variety of free tools on the Internet to generate the coordinates and the overall code.

JavaScript Bar Graph (Not a traditional bar graph) [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
In JavaScript I am trying to print out little ticks/hashes/lines (see image attached) to my html. I've tried googling a lot of things but haven't come across any bar graphs like this and I was wondering if anyone new how to do this, or could link me to some resources that would point me in the right direction.
Example of what i am Trying to achieve
Thanks in advance for the help.
It is a traditional bar graph... if you think laterally.
You can create a traditional bar graph in HTML by drawing a <div> element of the correct width, with a border and a fill colour.
You can turn it into a bar like the one you want to achieve by removing the border and replacing the solid fill colour with a simple background image that contains the line pattern.

How to build a graph page like this one? [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
I came accoss this webpage: http://www.concerthotels.com/100-years-of-rock and it is very cool. I would like to build some content with similar looking.
Is it possible that someone could give me a direction how this page is built? Thanks a lot for that.
this is made with javascript , css , html5
there are many jquery plugin like scroll magic who can give you the same effect as scrolling content automatically or made you own timeline : (http://janpaepke.github.io/ScrollMagic/)
also drawing and animating lines can made with SVG (Scalable Vector Graphics ), visit for more information (http://www.w3schools.com/svg/) .
hope this can give you a small view of how you can do the same effect :)

AMCharts candlestick chart, show entry/exit arrow [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 3 years ago.
Improve this question
Is it possible to show a little arrow at a specific price and time, indicating entries and exits in an AMChart? Something like:
If not, is there at least a way of creating custom drawing elements in the chart (circles, lines, squares) similarly to this but using a candlestick chart, not a line chart?
If none of that is possible, does anybody know about a JS library that's capable of doing so?
Thank you!
You can use events for this purpose: http://www.amcharts.com/demos/stock-events/
In the demo it's line chart,but events can be used with candlesticks as well.

Image move when vertical scroll mouse [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
How can I make an image move smoothly when scrolling mouse wheel up and down like in this website
By simply reading through the source of the page on the website you linked do, I found that they use an extension of jQuery for easing elements around the page smoothly: https://github.com/gdsmith/jquery.easing
That depends on mouse scroll event,first control mouse event and then join your iamge gallery with mouse scroll,its very simple just a logic

Categories

Resources