Home forums Report Bugs Data Series Name

This topic contains 1 reply, has 2 voices, and was last updated by  Sanjoy 6 months ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #10596

    rameshkv
    Member

    Hi,

    The data series name is not displayed in the stacked area chart. My code is below:

    var chart = new CanvasJS.Chart(“chartContainer”, {
    backgroundColor: “black”, zoomEnabled: true,
    title:{ text: “E & O Trend”, animationEnabled: true, fontColor:”white”, fontSize:16},
    axisX: {labelFontSize:12, labelFontColor: “yellow”, titleFontSize:12, titleFontColor:”yellow”, title:”Weeks”},
    axisY:{ includeZero: false, labelFontSize:12, labelFontColor: “yellow”,titleFontSize:12, title: “Value in $000″, titleFontColor:”yellow”},
    toolTip:{shared: true},
    legend: {
    cursor: “pointer”,
    itemclick: function (e) {
    //console.log(“legend click: ” + e.dataPointIndex);
    //console.log(e);
    if (typeof (e.dataSeries.visible) === “undefined” || e.dataSeries.visible) {
    e.dataSeries.visible = false;
    } else {
    e.dataSeries.visible = true;
    }

    e.chart.render();
    }
    },
    data: [{
    showInLegend: true, name:”NM”,fontColor: “yellow”,
    type: “stackedArea”,
    dataPoints: [{x: 1,y: 5}, {x: 2,y: 9}, {x: 3,y: 17},
    {x: 4,y: 32}, {x: 5,y: 22}, {x: 6,y: 14},
    {x: 7,y: 25}, {x: 8,y: 18}, {x: 9,y: 20},
    {x: 10,y: 15}, {x: 11,y: 26}, {x: 12,y: 22}
    ]
    }, {
    showInLegend: true, name: “SM”,fontColor: “yellow”,
    type: “stackedArea”,
    dataPoints: [{x: 1,y: 7}, {x: 2,y: 12}, {x: 3,y: 15},
    {x: 4,y: 22}, {x: 5,y: 32}, {x: 6,y: 18},
    {x: 7,y: 15}, {x: 8,y: 8}, {x: 9,y: 26},
    {x: 10,y: 25}, {x: 11,y: 22}, {x: 12,y: 29}

    ]
    }, {
    showInLegend: true, name: “E1”,fontColor: “yellow”,
    type: “stackedArea”,
    dataPoints: [{x: 1,y: 7}, {x: 2,y: 12}, {x: 3,y: 15},
    {x: 4,y: 22}, {x: 5,y: 32}, {x: 6,y: 18},
    {x: 7,y: 15}, {x: 8,y: 8}, {x: 9,y: 26},
    {x: 10,y: 25}, {x: 11,y: 22}, {x: 12,y: 29}

    ]
    }, {
    showInLegend: true, name: “E2”,fontColor: “yellow”,
    type: “stackedArea”,
    dataPoints: [{x: 1,y: 7}, {x: 2,y: 12}, {x: 3,y: 15},
    {x: 4,y: 22}, {x: 5,y: 32}, {x: 6,y: 18},
    {x: 7,y: 15}, {x: 8,y: 8}, {x: 9,y: 26},
    {x: 10,y: 25}, {x: 11,y: 22}, {x: 12,y: 29}

    ]
    }, {
    showInLegend: true, name: “E3”,fontColor: “yellow”,
    type: “stackedArea”,
    dataPoints: [{x: 1,y: 3}, {x: 2,y: 7}, {x: 3,y: 11},
    {x: 4,y: 31}, {x: 5,y: 20}, {x: 6,y: 24},
    {x: 7,y: 5}, {x: 8,y: 28}, {x: 9,y: 10},
    {x: 10,y: 23}, {x: 11,y: 16}, {x: 12,y: 12}

    ]
    }]
    });

    chart.render();

    help me fix this.

    #10597

    Sanjoy
    Moderator

    Rameshkv,

    Here, background and fontColor of legend are same. So, it’s not visible. You can show it by setting fontColor other then black.

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

You must be logged in to reply to this topic.