Home forums Using CanvasJS Bar chart showing nothing

This topic contains 2 replies, has 2 voices, and was last updated by  ajazurrahman 1 year ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • #18956


    Hello Js Gurus,

    Following is my json file



    I am trying to draw a chart from above data using following code. Will appreciate help on this.

    window.onload = function() {

    var dataPoints = [];
    var dataPoints1= [];
    var highlow=[];

    var chart = new CanvasJS.Chart(“top_destinations”, {
    animationEnabled: true,
    theme: “light2”,
    dataPointWidth: 20,
    title: {
    text: “YTD Top Destinations”,
    fontSize: 15,
    axisY: [

    labelFormatter: function ( e ) { return e.value; },
    } ] ,
    axisX: [

    labelFormatter: function ( e ) { return e.value; },
    data: [{
    type: “column”,
    axisYindex: 0,
    yValueFormatString: “#,### Units”,
    dataPoints: dataPoints

    function addData(data) {
    for (var i = 0; i < data.length; i++) {
    highlow[0]=data[i].minspend ;
    highlow[1]=data[i].maxspend ;




    $.getJSON(“top_destinations_high_low.json”, addData);

    <div id=”top_destinations” style=”height: 150px; width: 100%;”></div>
    <script src=”https://canvasjs.com/assets/script/jquery-1.11.1.min.js”></script>
    <script src=”https://canvasjs.com/assets/script/jquery.canvasjs.min.js”></script>


    Suyash Singh


    We observe that you are passing an array as y-value to a column chart. Since Column Chart accepts a single numeric y-value, you can either use one of the values from your highlow array or change the chart type to Range Column Chart as in this jsfiddle.

    If this doesn’t suit your requirements can you please create a sample jsfiddle or
    give us a pictorial representation so that we can understand your requirements better and help you out?

    Suyash Singh
    Team CanvasJS



    Many thanks Suyash for help . Yes it was a silly mistake. I have to create a rangechart.

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.