[Vishwas R]

@paulfansare,

The method that calculates the minimum, maximum and other parameters is called only on rangeChanged event because of which table is populated only when you zoom/pan or reset the chart. To populate the table soon after rendering the chart, you need to call the method soon after chart.render().

chart.render();
showTableData(chart);

Please take a look at this Updated JSFiddle.

—
Vishwas R
Team CanvasJS

[Vishwas R]

@paulfansare,

The link that you have shared seems to be working fine.

The JSFiddle that was shared earlier was adding 3 rows to the table which can be made generic to add number of rows based on number of dataSeries as shown in this updated JSFiddle.

—
Vishwas R
Team CanvasJS

[Vishwas R]

@mhdajmalik,

Chart should look same when same options and dataPoints are passed, I don’t understand why it looks different in your case. Could you please create JSFiddle reproducing the issue so that I can look into it and resolve it.

—
Vishwas R
Team CanvasJS

[Vishwas R]

Sateesh

Please take a look at our jQuery Gallery for an example on Chart inside resizable container. You can also make it draggable as shown in this JSFiddle.

Please share code to my mail id which is mentioned below.

We don’t provide email-based support however please refer the links shared above, which includes source code.

—
Vishwas R
Team CanvasJS

[Vishwas R]

@paulfansare,

You can update chart options dynamically. Please take a look at documentation on Updating Chart Options and Data for the same.

In your case, you can just update dataPoints of same dataSeries rather than removing dataSeries and adding new one. Please take a look at this JSFiddle.

—
Vishwas R
Team CanvasJS

[Vishwas R]

@daringdan,

If the length of video (in seconds / milliseconds) matches with the range of axisX (in seconds / milliseconds), you can seek video based on clicked position – with the help of convertPixelToValue method. Please take a look at this JSFiddle.

—
Vishwas R
Team CanvasJS

[Vishwas R]

@snehal,

You can read data from database and parse it according to your requirements. Please take a look at this sample project where stacked-column chart is rendered by accepting regDate and function fields from database. You can further customize it to read any field based on your requirements and render chart.

Also refer this forum thread for more info on rendering chart in PHP with data from database.

—
Vishwas R
Team CanvasJS

[Vishwas R]

@paulfansare,

It would be helpful for us to understand your issue better if we could run the code locally at our end and try out the scenario you are talking about, but the code that you have shared is partial, which we can’t make it work at our end. So I request you to create sample project reproducing the issue you are facing along with sample data and share it with us over Google-Drive or Onedrive.

—
Vishwas R
Team CanvasJS

[Vishwas R]

Daniel,

Glad that you figured out a way to make it work :)

—
Vishwas R
Team CanvasJS

[Vishwas R]

@snehal,

Can you kindly share the sample project reproducing the issue you are facing along with sample database over Google-Drive or Onedrive so that we can look into the structure of database and your code, understand your scenario better and help you out?

—
Vishwas R
Team CanvasJS

[Vishwas R]

@paulfansare,

You can render chart with dataPoints based on the values being selected from dropdown using change event. Below is the code-snippet for the same.

$(".dropdown").change(function() {
	chart.options.data[0].dataPoints = [];
  var e = document.getElementById("dd");
	var selected = e.options[e.selectedIndex].value;
  dps = jsonData[selected];
  chart.options.title = { text: "Chart with " + selected };
  for(var i in dps) {
  	var xVal = dps[i].x;
    chart.options.data[0].dataPoints.push({x: new Date(xVal), y: dps[i].y});
  }
  chart.render();
});

Please take a look at this JSFiddle for complete code.

But i am facing an issue, i want to add data series using a multiselect dropdown,

It would be helpful for us to understand your issue better when we look at your code working live in jsfiddle. So I request you to create jsfiddle reproducing the issue and share it with us.

—
Vishwas R
Team CanvasJS

[Vishwas R]

@cronk005,

The issue seems to happen due to overriding of window.onload event. Changing it to jQuery ready / load should work fine in your case. Please find the sample project here. Please refer this stackoverflow thread for more info.

PS: dataPoints are hardcoded in sample-project as AJAX requests (php-service-http://globe-trekking.com/vg/charts/top_aircraft_data.php) gave 404 Not Found Error.

—
Vishwas R
Team CanvasJS

[Vishwas R]

@snehal,

Please take a look at this sample project to render multi-series stackedColumn chart with data from database.

—
Vishwas R
Team CanvasJS

[Vishwas R]

@jmnn,

In update method, you are updating the last dataPoint’s y-value only and not x-value because of which x-value remains same and being shown in crosshair as such. Updating x and y-values should work fine in your case. To keep axis labels constant, please take a look at this sample dashboard. You can download the dashboards sample from our download page and try customizing and running locally.

—
Vishwas R
Team CanvasJS

[Vishwas R]

@paulfansare,

Yes, it works even if you add few more dataSeries as it’s made generic to work with multi-series.

—
Vishwas R
Team CanvasJS