Dynamic Timeline with Graph

by Tac Tacelosky   Last Updated January 10, 2019 23:16 PM

I like Yahoo Finance Stock Chart, and the way you can filter by a date range:

Finance Graph

I have a database of news headlines, and I'd like to replace our date filter, especially for the tag cloud, with some sort of dynamic range widget. I think most of our users are going to want to see headlines and tags from the most recent X days, so I could just use a regular slider, but the idea of being able to slide both the timeline length (3 months) and range (Sept '04 - Nov '04') seems pretty cool. Specifically, with the cloud tag you could visually represent which tags were popular during one particular time. Like "trending".

Finally, adding volume (headline count) like the stock chart volume could be interesting as well.

My question: Are there any javascript libraries / server libraries that do something like this already? Maybe with Google Charts? Or some jquery / jqueryui tool? We're using Bootstrap during development. I'd like to avoid Flash.



Answers 1

Below are 2 javascript libraries that can mimic your finance graph image.

Highcharts - http://www.highcharts.com/stock/demo/

amCharts - http://www.amcharts.com/stock/

There is also an interesting jQuery plugin date range slider called jQRangeSlider - http://ghusse.github.com/jQRangeSlider/stable/demo/, although adding any kind of volume trending to it would be more work.

As an aside, here's at least one article that questions the usability of tag-clouds. http://www.useit.com/alertbox/tag-clouds.html

March 10, 2012 13:36 PM

Related Questions

cropping image tool in javascript

Updated August 19, 2015 17:07 PM

How to show that a jqgrid has drag and drop enabled

Updated October 12, 2018 17:16 PM

UI design for mapping configurator

Updated April 08, 2015 22:06 PM