Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    Regular Coder
    Join Date
    May 2007
    Posts
    162
    Thanks
    13
    Thanked 0 Times in 0 Posts

    Any ideas for a JS circle calendar/flexible gauge?

    I see lots of JS examples of timelines, but I want to represent data that are continuous/cyclical. What I'd like to do is display 4 "seasons" on a circle, highlighting the part of the circle that the current date applies to, and likely having some interaction/mouseover capability to display more information.

    I've attached a simple diagram. I'm a novice coder but have dealt with JS long enough where if I had a general template I could make it work for my purposes.

    Does anyone know about a JS script that can support this or what the best way to implement this is? I'm guessing the circle would have to have the dates "mapped" on it, so the dynamic data would be dates, but the script would know what part of the circle corresponds to what date.

    I've seen gauges that could do similar things like google gauge from their charts API, but that doesn't have enough flexibility.

    Thanks very much!
    Attached Thumbnails Attached Thumbnails Any ideas for a JS circle calendar/flexible gauge?-seasons.png  

  • #2
    Senior Coder
    Join Date
    Sep 2010
    Posts
    1,912
    Thanks
    15
    Thanked 227 Times in 227 Posts
    What you're basically describing is a pie chart with text markup, it can be built with canvas or svg, or you could use G-D or ImageMagick to make an image of the chart. There's plenty of code around for making pie charts, much of it compatible with javascript.
    Welcome to http://www.myphotowizard.net

    where you can edit images, make a photo calendar, add text to images, and do much more.


    When you know what you're doing it's called Engineering, when you don't know, it's called Research and Development. And you can always charge more for Research and Development.

  • #3
    Senior Coder DanInMa's Avatar
    Join Date
    Nov 2010
    Location
    Salem,Ma
    Posts
    1,577
    Thanks
    13
    Thanked 248 Times in 248 Posts
    you can use this http://www.jqplot.com/

  • #4
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,294
    Thanks
    10
    Thanked 583 Times in 564 Posts
    you can graph that in an excel of google spreadsheet.
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/5/28) IE7:0.1, IE8:5.3, IE11:8.4, IE9:3.2, IE10:3.2, FF:18.2, CH:46, SF:7.9, NON-MOUSE:32%

  • #5
    Regular Coder
    Join Date
    May 2007
    Posts
    162
    Thanks
    13
    Thanked 0 Times in 0 Posts
    Thanks! I'll try an interactive pie chart and see if I can make it do what I want.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •