[UPDATE]
We have just released v2.1 with module import/export options with which you can easily integrate CanvasJS with any front-end framework like React, Angular, Vuejs, etc. Please refer to the release blog for more information. Do download the latest version from our download page and let us know your feedback.
Please follow the below steps to add React Charts into your app.
1. Save canvasjs.react.js and canvasjs.min.js within source-folder of your React application ( src or src/assets or src/lib )
2. Import the chart component into your app.
import CanvasJSReact from './canvasjs.react';
For step-to-step tutorial and example on integration, please checkout documentation page. Also checkout React Gallery for more examples.
We are looking into it and will get back to you at the earliest.
—–
Bivek Singh
The same-origin policy restricts how a document or script loaded from one origin can interact with a resource from another origin. For further details please refer the following links:
[1]. Same Origin Ploicy
[2]. Stackoverflow thread
—-
Bivek Singh
Yes, you can place an image at any position you like. You just need to provide the pixel co-ordinates position to the top and left CSS properties of image. You can also make use of convertPixelToValue and convertValueToPixel methods provided in the library.
For your second query, You can draw anything you like on the canvas. Please take a look at this jsFiddle.
—-
Bivek Singh
For security reasons, browsers restrict cross-origin requests. Please refer this stackOverflow post for more information.
Since you are storing date as labels and not as x-value, you should use e.label
instead of e.value
in labelFormatter function of axisX. Please take a look at this updated JSFiddle.
—-
Bivek Singh
You can align the indexLabels inside bar / column using indexLabelPlacement. Similarly, background for indexLabels can be set using indexLabelBackgoundColor.
For formatting indexLabels, you can use indexLabelFormatter or you can format axisY values using yValueFormatString.
Please take a look at this jsFiddle.
—-
Bivek Singh
After setting lineCap and lineJoin properties, you need to re-render the chart. You can do so by calling chart.render() again or you can set those properties before first render. Please, take a look at this fiddle.
—-
Bivek Singh
dataPointWidth should be placed outside dataSeries object.
{
dataPointWidth: 20,
.
.
data: [{
.
.
}]
.
.
}
Please check the updated JSFiddle.
—–
Bivek Singh
Team CanvasJS
Instead of using x, you can use label to pass the string. Please take a look at this updated JSFiddle.
—-
Bivek Singh
Team CanvasJS
The date that you have provided as x value isn’t valid date in JavaScript. While Chrome and IE translates your date internally to a valid date, Firefox doesn’t. That’s why, your chart isn’t rendered on Firefox. In order to fix this issue, please format your date accordingly. For valid JavaScript date format, please refer this.
—-
Bivek Singh
Dinesh,
Thank you for reporting. We have fixed the issue and will be releasing with the fix in a day or two.
——-
Bivek Singh
This feature is not available out of the box as of now. However you can achieve this using a workaround. Above fiddle has been updated for the same. Also, please, take a look at this jQuery plugin documentation for contextMenu.
—–
Bivek Singh