[Ananya]

@amon75,

Please refer to this Stack Overflow thread for more information on fetching last 24 hours’ data from database. You can pass the fetched data to the chart and render it.

—
Ananya Deka
Team CanvasJS

[Ananya]

@amon75,

Please take a look at this gallery page for an example on rendering chart with data fetched from MySQL database. you can also refer to this page for an article about the same.

—
Ananya Deka
Team CanvasJS

[Ananya]

@netbal21,

You can get a reference to the chart instance and use it to update the data. Please take a look at this StackBlitz for an example of the same. You can also take a look at this gallery page for more examples of dynamic charts.

—
Ananya Deka
Team CanvasJS

[Ananya]

@scompliance,

Since the two charts have varying number of dataseries, there is a difference in datapoint width. You can use dataPointWidth property to enforce the same column width across the charts.

—
Ananya Deka
Team CanvasJS

[Ananya]

@scompliance,

Datapoint width depends on multiple factors including range of x-axis, number of dataseries, sequence of datapoint values, etc. Sorting the data by x-values should work in your case, and give you columns of similar width. Please take a look at this updated JSFiddle for an example of the same.

—
Ananya Deka
Team CanvasJS

[Ananya]

@scompliance,

Setting the stripline that is used to set the background color to be the first in the stripLines array should work fine in this case. Please take a look at this updated JSFiddle for an example of the same.

—
Ananya Deka
Team CanvasJS

[Ananya]

@scompliance,

Thanks for your feedback. We will add it to our wishlist. In the meantime, you can use stripline to apply background color to the plotarea as a workaround. Please refer to this JSFiddle for an example of the same.

—
Ananya Deka,
Team CanvasJS

[Ananya]

@sujeet,

You are getting this warning because angular-charts package uses CommonJS/AMD modules. You can suppress the warning by adding it to allowedCommonJsDependencies under build options in your angular.json file, as shown below:

"build": {
    "options": {
        "allowedCommonJsDependencies": [
            "@canvasjs/angular-charts"
        ],
        ...
    },
    ...
}

Please refer to this angular documentation for more information.

—
Ananya Deka
Team CanvasJS

[Ananya]

@scompliance,

Sorry, it’s not possible to move the toolbar using any property as of now. However, you can use CSS to style it, as it is a DOM element, and change its position. Please take a look at this CSS snippet for an example on how to do the same.

.canvasjs-chart-toolbar {
    top: -50px !important;
}

—
Ananya Deka,
Team CanvasJS

[Ananya]

@ben-haestqed-lu,

valueFormatString seems to be working fine with date and time components. Can you kindly create a JSFiddle reproducing the issue you are facing and share it with us, so that we can look into the code and chart-options being used, understand the scenario better and help you out?

—
Ananya Deka,
Team CanvasJS

[Ananya]

@phrogz,

Glad that you figured it out, and that works for you.

—
Ananya Deka
Team CanvasJS

[Ananya]

@patdepri_new,

You are attempting to create a chart in the div with id “chartContainer1” which does not exist. So the code stops executing and does not render anything on screen. Please check browser console for the error. Not creating chart with the id that doesn’t exist should render all other charts in this case.

—
Ananya Deka
Team CanvasJS

[Ananya]

@patdepri_new,

Rendering multiple charts in a page seems to be working fine. Please refer to this documentation page for a step-to-step walkthrough of the same. If you are still facing issue, kindly create a JSFiddle reproducing the issue you are facing and share it with us so that we can look into the code, understand the scenario better and help you out.

—
Ananya Deka,
Team CanvasJS

[Ananya]

@intellicus,

Thank you for the valuable feedback. As a workaround, you can combine Stacked Bar 100 and Bar Chart to achieve Bullet Chart as shown in this JSFiddle. Similarly, you can use Doughnut Chart to create a Gauge Chart, as shown in this JSFiddle.

You can refer to this article for more information about creating Bullet Chart using our library.

—
Ananya Deka
Team CanvasJS

[Ananya]

@ss12,
You can add a dropdown to select the zoomtype as shown in this JSFiddle.

—
Ananya Deka
Team CanvasJS