Get chart instance from DOM element

• October 2, 2021 at 12:31 pm #35900
  
  rr93

  My chart is defined as:

  var lineChart = new CanvasJS.Chart("lineChartContainer", {
          animationEnabled: true,
          axisY :{
              includeZero: false,
              gridColor: "rgba(140, 140, 140, 1)"
          },
          toolTip: {
              shared: true,
              content: false
          },
          legend: {
              fontSize: 13
          },
          data: lineChartData.json
      });

  And I’m trying to access the instance of the chart via its DOM element by any of the two methods:

  var charr = $('#lineChartContainer').CanvasJS()
  var charr = $('#lineChartContainer').CanvasJSChart()

  The first says CanvasJS is not a function and the second returns an undefined object. I’m using the JQuery plugin. Please advise.

  • This topic was modified 3 years, 2 months ago by rr93.
  • This topic was modified 3 years, 2 months ago by Vishwas R.
  October 4, 2021 at 6:38 pm #35916
  
  Indranil

  @rr93,

  Based on the code sample shared by you, it seems like you are trying to create the chart in JavaScript way and using the jQuery plugin to get a reference to the chart object. Instead, you can create the chart in jQuery way using $("#chartContainer").CanvasJSChart(options); then get a reference to the chart object using $("#chartContainer").CanvasJSChart();. Please take a look at this documentation page for more information on creating chart using the jQuery plugin.

  

  ___________
  Indranil Deo
  Team CanvasJS

  October 5, 2021 at 12:09 am #35921
  
  rr93

  @Indranil okay, so there’s no way to get the chart’s instance if the chart is created the JavaScript way? It’s only possible with the jQuery way?

  And are there any “side-effects” I should know about if I change my chart to being created with jQuery as opposed to how it is now? Or would they behave exactly the same way?

  October 5, 2021 at 6:52 pm #35929
  
  Indranil

  @rr93,

  CanvasJS jQuery plugin is just a wrapper for CanvasJS JavaScript chart, which allow you to integrate CanvasJS Charts the jQuery way i.e. $("selector").someAction().

  There are no side-effects or any difference between them apart from the way it’s been used. With jQuery plugin you can get a reference to the chart object through the DOM element using $("#myChartContainer").CanvasJSChart(); if it’s created using jQuery plugin ( $("#myChartContainer").CanvasJSChart(chartOptions); ).

  ___________
  Indranil Deo
  Team CanvasJS