Home › forums › Using CanvasJS › Line chart with bar chart
Tagged: Line and Bar chart of same data
This topic contains 14 replies, has 3 voices, and was last updated by Vishwas R 9 months, 2 weeks ago.
Need help in Line chart and bar chart.
I need bar and line on same chart, multiple point
A bar chart cannot be combined with line chart. If you are looking out to combine column and line charts, please take a look at our gallery example on combination of charts.
__
Priyanka M S
Team CanvasJS
I have column chart with moving average? Is it possible to add another line with column without affecting moving average.
You can combine multiple dataSeries of column chart with line chart. Please take a look at documentation on multiseries chart for more info.
It would help us understand your exact scenario better if we could look at your code at our end, so I request you to create JSFiddle with your use-case and share it with us if you are facing any issue.
—
Vishwas R
Team CanvasJS
Dear Vishwas R,
Thank you for response, I am new to CanvasJS and I need Trendline Chart in my existing chart.
Chart should look like the link given below Trendline only.
http://www.jqchart.com/jquery/chart/ChartTypes/TrendlineChart
Please advise how to do this.
Thanks Vishwas,
This is what I want in my chart what you are showing in jsfiddle, I am taking data from Database and my ques are,
How should I take start and end value?
How should I calculate Y=mx + b for Trendline Calculation. I only have x Value. How do I calculate m and b value.Or is there any way to calculate trend line from database value.each time data will vary, sometimes I get 5 rows, Sometimes I get 10 row for chart. in that case how do I calculate Trendline.
I have have some code but I can’t paste here as it is long. How do I show you my code. In jsfiddle it will not work because databae is not there. Please help.
Regards
One More Question: yValue += Math.round(Math.random() * 10 – 5); What is 10 and 5 here? What we are doing in this formula. Sorry I am new to this.
You can calculate the dataPoints to the trend-line dynamically by calculating slope as explained in this stackexchange thread. Here is the updated JSFiddle.
One More Question: yValue += Math.round(Math.random() * 10 – 5); What is 10 and 5 here? What we are doing in this formula. Sorry I am new to this.
JavaScript random method returns a floating-point, pseudo-random number in the range 0–1 (inclusive of 0, but not 1). With the help of random method, you can generate a random number between two numbers (lets say you need a number between 0 and 100), which is used in the JSFiddle that’s shared with you.
—
Vishwas R
Team CanvasJS
Thanks Vishwas,
This is what I want in my chart what you are showing in jsfiddle, I am taking data from Database and my ques are,
How should I take start and end value?
How should I calculate Y=mx + b for Trendline Calculation. I only have x Value. How do I calculate m and b value.Or is there any way to calculate trend line from database value.each time data will vary, sometimes I get 5 rows, Sometimes I get 10 row for chart. in that case how do I calculate Trendline.
I have have some code but I can’t paste here as it is long. How do I show you my code. In jsfiddle it will not work because databae is not there. Please help.
Regards
In the JSFiddle provided in previous reply, calculateTrendLine
method calculates trend-line dynamically based on dataPoints passed to chart, irrespective of source of dataPoints. Please refer this stackexchange thread for more info on calculating trend-line / Y=mx+b.
If adding calculateTrendLine method doesn’t work in your case, kindly share sample project with sample database over Google-Drive or Onedrive, so that we can look into your code, understand it better and help you out.
—
Vishwas R
Team CanvasJS
IS it possible to setup Skype call or Team Viewer to understand the logic and steps for Trendline chart.
You must be logged in to reply to this topic.