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.
Related
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
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 :)
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
I've already built the animation part, used JS to control the in SVG element.
Now what I want to achieve is something like this:
I tried to use paths.getBoundingClientRect() to get the distance between viewport's border to the path's highest position, so I can make the whole background change when the peak reaches a certain position. (if (rect.top <= 100) {...})
But I don't know how to control irregularly shaped areas' attributes.
Any possible solution?
Thank you very much.
i have used http://d3js.org for that sort of thing. it is very good. It provides a simple library to help you draw the graphs you want using svg. I think the particular part you are looking for is called library.
This is the API call.
https://github.com/mbostock/d3/wiki/SVG-Shapes#area
Some links below to examples and code for using d3js
http://bl.ocks.org/mbostock/3894205
http://bl.ocks.org/mbostock/3883195
http://mbostock.github.io/d3/talk/20111018/area-gradient.html
http://bl.ocks.org/NPashaP/113f7fea0751fa1513e1
http://bl.ocks.org/mbostock/1667367
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
I want to create a webpage displaying an image that has areas on it that can be clicked to do various things like playing sound, displaying text, linking to other pages. The only problem is I have no idea what I need to use within javascript to do so. The area need not be complicated, just a simple geometric shape.
What sort of tools should I be looking at in Javascript to do achieve this?
Thanks in advance
You might want to take a look at <map></map> tag in HTML: http://www.w3schools.com/tags/tag_map.asp
It should accomplish what you want to do.
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.