I need to calculate the distance on the canvas dynamically (something like shown in fig.). I need to drag the highlighted joints so that calculating span can be increased / decreased.
Does there exists any plugin for this? If not, can you give me some suggestions to do it effectively. Thanks
I use Google closure, and it has a distance function:
http://closure-library.googlecode.com/svn/docs/class_goog_math_Coordinate.html
Not sure if that is an option for you, I personally recommend it if you have a complex drawing app.
If you can't just look at the code provided "Source Code" link at top, it can help you do something similar in your code.
Related
I just want to put an outline on a box I am hovering over. I remember seeing a tutorial on this before but now I can't seem to find anything on it. Any help would be greatly appreciated!
As far as I know there is no outline attribute for a 3d shape in x3d.
You could maybe do a trick by having two boxes, the second one (the bigger one, maybe different color) being the "outline" of the first one. I would put the two in a Switch node. On mouse over display the bigger one.
Or maybe another solution (easier) is to change the size parameter of your box. You can do this by routing a SFVec3f value to the scale of your box or by writing a bit of javascript code.
Does anyone know how to add the score to the star, something like this:
I thought about making the numbers in Photoshop, but then how it's going to scale on different size screens?
Also thought about setup JS to calculate width. However it seems for me as a complex one.
If anyone know a quick workaround / hack / or may be out of box solution. That would be perfect.
Well I just created an image and put it underneath the Raty...
Not the best approach, but it did work
You can create a placeholder for each star.
Use the same with for start and it place holder.
I am planning on making an analytics dashboard and would like to implement circular charts like the image attached to this question:
and I would like to do it using jQuery. Do you guys have any usefull links to resources or to other SO questions? Would be awesome!
Thanks!
You can also take a look at :
http://bernii.github.com/gauge.js/
http://www.justgage.com/
Both of them look really good and seems pretty easy to use.
The easiest way would probably be to create an SVG that mimics the appearance you want, and then use JavaScript/jQuery to modify the source of the SVG. The design you're requesting could probably be acheived by simply placing two arcs on top of one another.
Deriving from this excellent answer on calculating arcs, creating two overlapping ones could look something like this, which also demonstrates updating the arc dynamically.
lethargicpanda's suggestions are cool. Check out jQuery Knob too. It also allows user input.
I have a requirement to have a universe type menu, where there is a main item in the center, and "X" amount of items around it. (ie: sun with planets).
I have searched high and low for an example, and all of the search results points to using css, but this requires manually figuring out the position of the items.
How can I create a menu like this where I can dynamically add items?
I am sure there is some jQuery / javascript example somewhere
Did you try searching for pie menus? There are a couple of jQuery Plugins:
jQuery - Pie Menu
jQuery Canvas Pie Menu
check out jQuery Radmenu - http://tikku.com/jquery-radmenu-plugin
I've just done a hell of lot of googling for you - but couldn't find anything either.
So, the answer must be - write it for yourself (see, that's fun!).
I found this great resource to help out. It's not JavaScript, but the code could easily be rewritten to help drawing the invisible circle needed to do the trick.
Some sin/cos stuff will probably also be needed - to determine where on the circle your menu points should be, dynamically. It's unfortunately not just as simple as saying 360/numberOfMenus ;-)
I hope this helps you out. Sometimes, the answer is that you have to do it yourself :D
I found this thread too late, because I also built one. You can find it here: http://www.pritaeas.net/public/jquery/hp/circulate/index.html
It is a jQuery plugin, very small, that positions li items in a circle.
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.