I would like to create charts similar to Google Analytics which allow you to aggregate data by day, week, month...
As an example, the following chart data displays daily data for a month:
And by clicking 'Week', the chart aggregates the data points into weeks:
The closest I can find is the Ruby library Timeslicer, https://github.com/Trimeego/timeslicer . Is there something similar in Javascript or a Flot plugin out there?
Have you with tried http://www.jqplot.com/ ?
It is easy to use... but if you use MVC I would use the Char built in object. Anyway, I hope this can help you!
Related
I want to prepare a line stock highchart like this example : https://www.highcharts.com/demo/stock/lazy-loading
In the given example, when you load the chart for the first time, it calls https://demo-live-data.highcharts.com/aapl-historical.json and fetches some points, to be precise 0-165 records (if you check the network tab and ajax call). At a same time All option is selected in the time range tool.
If you drill down further or go for any specific time range, it will bring more data always from the server.
Question: If you have millions of data points, consider from 2000 to 2022 years, then for All option, what are you going to display. what should be the initial data set or result or filter ?
NOTE: I will have millions of data points from 2000 to 2022 years going forward. When I load the chart for the first time, out of these millions points, what should come back from the server ?
Just for your reference, you can check example of time series data that I'm going to have in mock-data=>i.js folder/file which is NOT being used anywhere in below example as of now.
Highcharts 1.7 million points example : https://stackblitz.com/edit/js-wng4y6?file=index.js
P.S. : I'm new to stockhighcharts and I don't seem to find any proper explanation anywhere. Trying to reach out to the community for further help.
Server-side data grouping should be done based on the range for with you are trying to group the data, so All means nothing - however, in your case this will be 2 years.
For the data grouping you might also consider the chart size (this is done by default for a dataGrouping feature running client-side in Highcharts Stock). When relevant information is passed to the server it should return a set of grouped data points.
About grouping logic you can find more in the api options where is present method of approximation inside a group.
https://api.highcharts.com/highstock/series.area.dataGrouping.approximation
Sending this much data to highcharts to be processed is asking for issues. I highly recommend making a local highcharts server (something they support) and have this done within your system. See it here
This is very important when it comes to security as well (if your data is sensitive), having it race across the internets to highcharts and then sent back to you leaves it open to the world.
From here, you can also specify the start and end time of each render, and have that change based on user input. Personally I would generally display the last 5 days or something, and then if someone wanted to, they could pull the slider all the way back for the last significant amount of time.
But, to answer your question, when you send a data object to highcharts, either local server or the highcharts server, you will get a base64 image back that you can directly imbed in your UI.
I have data in json format with date and values. Is it possible to switch from daily chart to weekly chart (rollup) through only any JavaScript based charting application , where i can mention the rollup function to be either sum or something else.
I want to avoid any server-side calculations.
Any suggestions or example will be of great help.
I have coin currency market application and I would like to integrate a graph in it, however I don't know from where data should be taken. Is there some API that I can integrate into my highcharts in order to get graphical representation of values of the coin in the past 7,14,30 days? I have scrapped all data from http://coinmarketcap.com/ but I can't scrap graph because it's canvas. Can you help me with that? Where to search for coin data in the past?
The coinmarketcap site uses json data for the charts. If you look at the network activity in the console, you can see requests for items like:
http://coinmarketcap.com/static/generated_pages/currencies/datapoints/bitcoin-main.json
This contains the json data for the bitcoin chart. However, there does not seem to be any way to specify different time periods.
A quick look around produced this site for bitcoin info (https://bitcoinaverage.com/api). There are lots of links which may help here: able to get prices from here: http://bitcoincharts.com/charts
You can also check yahoo fincancem which allows to get data via API.
I'm currently extracting the amount of sessions by date from the google analytics api. I turn this data from a basic Javascript array into a JSON. The JSON data looks like this
[["20140521","7"],["20140522","5"],["20140523","1"]]
The date then the amount of sessions.
I'm fairly new to using D3.js but can't seem to find an accurate guide on how to take each object and plot my dates as the x and my sessions as the y. I'm also aware that I may need to make my data look like this: ["20140521": 7] How could I go about doing this?
If somebody could point me in the right direction it would be much appreciated. Please let me know if you have any questions!
Thank you!
am working on a school project. Final year BscIT. I used spring framework, jstl, spring-data-mongo and mongodb for storage. The project has an Restful API to which pharmacies and hospitals send some data to.namely their diagnostics and the number and type of medicines purchased.
Here I am trying to show the trends in a dashboard as and when anytime occurs in the database.I use jquery as javascript framework and after studying kendo dataviz, amchart and highchart , I will be going with amchart
Now It really doesn't matter with visualization tools I use. I am more interested in how to do it and prevent the browser from freezing.
Below is what am thinking:
option 1: I will be querying the database every 5 seconds.Does that means the javascript should know the "previous" 5 seconds ? As in I will pass the previous 5 seconds as start date and now as end data?
option 2 I will pull all data of the day every 5 seconds.
Am really not sure about how it is done in real life so, anyone feel free to show me the path.
Thanks in advance