@brianali,
Creating the chart within ngOnInit() should work fine. Also, if your div-id is chartContainer, the same ID has to be passed as container-id to CanvasJS as const chart = new CanvasJS.Chart("chartContainer", {. Please take a look at this sample project on using CanvasJS charts with AngularJS-2.
chartContainer
const chart = new CanvasJS.Chart("chartContainer", {
__ Priyanka M S Team CanvasJS
@Black3rror,
In lines 28,29,30 we are setting shadowColor, shadowBlur and shadowOffsetX. If you are rendering only one chart type, you can comment lines 49,50,51. If you are combining different chart types like line, column, area etc. and if those lines are commented, the shadow gets applied to all the chart types. So it’s advised to reset it.
@maheshbapathi,
You can simply render chart inside setInterval or setTimeout function, which renders the chart for every set duration. Please check this thread for more information.
__ Priyanka M S TeamCanvasJS
@khammad,
Can you please check browser console for any errors?
1) Please take a look at this jsfiddle to set shadow in line chart.
Maybe it can be done by mouseover and mouseout functions but it seems to be a better solution. if not i’ll be glad if you put some code to change color(something like e.dataSeries.dataPoint.color=”red”; ?!!!)
Thanks for your suggestion. We’ll reconsider it for our future releases.
3) toolTip can be hidden on click of dataPoint by disabling it on click and enabling on mouseover. Please take a look at this jsfiddle.
@alximick,
Specifying range by X is not available as of now.
Jay,
Please take a look at this jsfiddle.
Thanks for your interest in CanvasJS. I have forwarded your query to our Sales Team and the concerned person will be contacting you shortly over email, they will assist you in upgrading. Are you looking for Range Column Chart? If not, could you please provide a pictorial representation of your requirement so that we can understand it better and help you out?
In order to load a local file on browser, you need to have a local server running in your system to avoid cross origin requests which most of the browsers doesn’t support. You can read data directly from a local text file (sample.txt), please take a look at this sample project.
@asanga,
The values you seen on axisX are the x values that you provided to dataPoints. You can change the date as per your requirement, by providing proper unix/PHP timestamps to the x-value. Please take a look at date-time axis in docs page for more info.
@saul_romero,
Instead of updating the dataPoints at certain interval, update dataPoints frequently for every count of loop and later update the chart at the required interval. This would solve your requirement. Please take a look at this jsfiddle.
@matt1256,
Thanks for the feedback. We will reconsider this for our future releases.
It is possible to render chart from a dynamically updating text file. Please take a look at this jsfiddle. The format of the text file(datapoints.txt) should be as below (representing x and y values):
10 20 15 25 20 15 25 33 30 9 35 15 40 20
@vladimirs,
To avoid overlapping of labels, interval is automatically calculated. When interval is set to 1, labels get rendered for every value within the axis range. In your case, labels get rendered for every value starting from 1 to 5000000 since the interval is set to 1, resulting in label overlapping and delay in rendering. However, interval for axes has to be set according to the range of input that’s been provided to the chart. Please refer to interval in our documentation.
If max value more than 1000 times of interval, then interval should be switched to auto.
Thanks for the suggestion. CanvasJS doesn’t ignore user provide inputs, except for the rare scenarios. However, if the interval is not set, it gets auto-calculated.