[Vishwas R]

@justxtasy,

You can build datapoints JSON as shown below.

$.each(data, function (i, item) {
    dps.push({label: item.ProfileName, y: item.TotalCustomer});
});

Please take a look at this JSFiddle for an example.

—
Vishwas R
Team CanvasJS

[Vishwas R]

Callam,

It would help us if you can provide us the working fiddle of the issue along with proper JSON-data.

Here is an example to give you an idea on using external JSON in JSFiddle.

—
Vishwas R
Team CanvasJS

[Vishwas R]

You can render chart on clicking a button using onclick mouse-event. Please take a look at this JSFiddle for an example on rendering chart on button click with data from multiple CSV.

—
Vishwas R
Team CanvasJS

[Vishwas R]

Mitul,

JQuery is loaded in the example provided. In JSFiddle, under JavaScript section, you can include libraries like JQuery, AngularJS directly.

Check this Screenshot.

[Vishwas R]

Mitul,

We checked both the examples in desktop as well as in android and found its working fine. It would help us to resolve the issue if you could create a fiddle of the issue you are facing.

[Vishwas R]

[update]

We have just released v1.9.6 Beta with Methods & Properties, which allows you to programmatically export chart as image, print chart, access internally calculated values, etc. Please refer to the release blog for more information.

Mitul,

You can hide ‘save as PNG’ using CSS. Here is an example.

You can also have a button/link outside chart to export it as JPEG, using dataURL. Here is an example.

[Vishwas R]

Michael,

You can parse the JSON data and pass dataPoints to respective dataSeries in chart options as shown below

$.ajax({
  type: 'GET',
  url: 'https://api.npoint.io/191c62a905159a49256e',
  dataType: 'json',
  success: function(field) {
    for (var i = 0; i < field.length; i++) {
      dataPointsA.push({
        x: field[i].time,
        y: field[i].xxx
      });
      dataPointsB.push({
        x: field[i].time,
        y: field[i].yyy
      });
    }

    var chart = new CanvasJS.Chart("chartContainer", {
      title: {
        text: "JSON from External File"
      },
      exportEnabled: true,
      data: [{
        type: "line",
        name: "line1",
        xValueType: "dateTime",
        dataPoints: dataPointsA
      }, {
        type: "line",
        name: "line2",
        xValueType: "dateTime",
        dataPoints: dataPointsB
      }, ]
    });

    chart.render();

  }
});

Here is an example for loading JSON data from external source using AJAX.

You can also refer loading data from external JSON in this example.

—-
Vishwas R
Team CanvasJS

[Vishwas R]

@mmfc,

You can customize & style the tooltip to fit in your requirements using properties like borderColor, fontColor and backgroundColor.

toolTip: {
	borderColor: "#000000",
	backgroundColor: "#F4D5A6",
	fontColor: "#FAC003"
}

—
Vishwas R
Team CanvasJS

[Vishwas R]

Fernando,

Thanks for the information. We look into the issue and get back to you at the earliest.

[Vishwas R]

[Update]
Print resolution should be handled in ‘Printer Settings’, however you can increase the resolution of image when exported chart as image as shown in this JSFiddle.

Jhaagsma,

Sorry for the inconvenience. We are looking into the issue and will get back to you.

[Vishwas R]

David,

As of now controlling the tick and label start point is not available. Interval start point will be calculated automatically and varies for different intervalType. We consider it for future release.

[Vishwas R]

Nefron,

As of now this feature is not available. But you can change color of line once it switches from negative to positive and vice-versa. Here is an example.

[Vishwas R]

Danny,

Thanks for the information. Probably this is the reason why we have not been able to reproduce the issue at our end yet. We will look into it further.

[Vishwas R]

@mmfc,

You can define the format of x-value shown in tooltip & indexlabels by setting xValueFormatString. However if you like to completely format / custom-content in the tooltip content, you can use toolTipContent.

—
Vishwas R
Team CanvasJS

[Vishwas R]

Danny,

We are glad that you were able to fix the issue. We had seen similar Bug last year in one of the Chrome Updates which they fixed after sometime. Seems like the same/similar issue has reappeared in current version of Chrome. Hoping that they’ll resolve this issue soon. We’ll also try to reproduce this problem at our end in a normal canvas and report the same to Chromium team.