Tejal,
I have tried the same thing for doubleclick event. But in this case I can not focusout with single click. Can you please suggest solution for this. https://jsfiddle.net/xw3p5k8b/7/
You can attach double-click event to the chart-container as and fire focus-out on single-click as shown in this updated JSFiddle.
My canvas are getting generated dynamically because of which I am not getting the element. In my snippet I am adding a doubleclick event on container itself but I am not getting exact event object and even its not working.
In short I want to attach event on container div itself and I should be able to find out the title of the legend on which I have clicked on.
Binding double-click event on window-load should work fine in this case. Please take a look at this updated JSFiddle.
—
Vishwas R
Team CanvasJS
Defining custom color-set array using addColorSet method works fine in Vanilla JS, React, Angular, etc. Please take a look at this sample project.
—
Vishwas R
Team CanvasJS
You can find the area of column by multiplying its height (y-value of the dataPoint) and width (width of the dataPoint). Please take a look at this JSFiddle, where area of individual columns are calculated when you click on it.
—
Vishwas R
Team CanvasJS
The issue seems to be with the scope of the variables – chart, please refer this stackoverflow thread for more info on scope of a variable in JavaScript. Please find the working code-snippet below.
var updateInterval = 100;
var chart;
var dps;
$(document).ready(function() {
$.getJSON("testdata.php", function(result) {
dps = result;
chart = new CanvasJS.Chart("chartContainer", {
title: {
text: "Test",
},
axisY: {
minimum: 0,
maximum: 1000
},
data: [{
type: "stackedBar",
dataPoints: dps
}]
});
chart.render();
});
var updateChart = function() {
$.getJSON("testdata.php", function(result) {
dps.splice(0, dps.length);
$.each(result, function(index, value) {
dps.push(value);
});
});
chart.render();
};
setInterval(function() {
updateChart()
}, updateInterval);
});
Please take a look at this php file for complete code.
—
Vishwas R
Team CanvasJS
The page seems to show JSON and not HTML content as you are setting header. Removing the header should work fine in your case, please take a look at this updated code. Please checkout our PHP Gallery for more examples, you can also download PHP samples from our download page and try running it locally.
—
Vishwas R
Team CanvasJS
When there are large number of dataPoints, markers are automatically disabled. You can override this by setting markerSize in dataSeries.
—
Vishwas R
Team CanvasJS
The behavior of stacked-area is by design. We will reconsider this behavior in future releases.
—
Vishwas R
Team CanvasJS
Can you kindly share sample project over Google-Drive or Onedrive so that we can run it locally at our end, understand the use-case better and help you out.
—
Vishwas R
Team CanvasJS
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
Victor,
Kindly make sure you are including jQuery in your project, and not jQuery slim – which excludes AJAX and animation effects modules. Including jQuery instead of slim should work fine in this case. Please refer this to stackoverflow thread for more information.
If you are still facing issue, kindly create a sample project reproducing the issue you are facing & share it with us over Google-Drive or Onedrive so that we can look into your code, understand the scenario better and help you out.
—
Vishwas R
Team CanvasJS
Apologies for the inconvenience caused. The issue seems to be due to the breaking changes in Webpack that was introduced in v2.2.0-rc.5 since when you can mix require and export whereas you can’t mix import and module.exports. Please take a look at this sample project that works fine with Webpack 2.4.1.
—
Vishwas R
Team CanvasJS
The link shared seems to be working fine. Here is the download link for your reference: https://1drv.ms/u/s!Am6ZJqYg9ZmfgglW57iRB6azpcX_
—
Vishwas R
Team CanvasJS