Search code examples
rgraph

X axis title is disappearing after first time, when reloading rGrpah chart on same div


I am using rGraph to draw the chart. it is working fine for the first time. when trying to generate the graph with different input data for the second time, without refreshing the page. The graph is generating fine, but the x-axis title is disappearing. can anyone help me with this?

FYI: I am making that div empty, before generating the graph.

Attaching image: 1: enter image description here

In the first image, you can see the Date.

  1. enter image description here

Here you don't see the Date. when I change the input data and tried to generate the chart.

            if(document.getElementById(chartID)){
                RG.ObjectRegistry.Remove(document.getElementById(chartID));
            }
            var barGraph = new RGraph.Bar({
                id: chartID,
                data: chartData,
                options: {
                    variant: '3d',
                    variantThreedAngle: 0.05,
                    colorsStroke: 'rgba(0,0,0,0)',
                    colors: chartColorArr,
                    marginTop: 35,
                    marginLeft: 45,
                    marginRight: 15,
                    marginBottom: 85,
                    xaxisLabels: x_axis_label_Arr,
                    shadowColor:'#ccc',
                    shadowOffsetx: 3,
                    backgroundGridColor: '#eee',
                    xaxisScaleZerostart: true,
                    axesColor: '#f2f2f2',
                    //yaxisScaleUnitsPost: 'H',
                    //title: 'User Sessions',
                    //key: [legendsTitle],
                    keyShadow: true,
                    keyShadowColor: '#ccc',
                    keyShadowOffsety: 0,
                    keyShadowOffsetx: 3,
                    keyShadowBlur: 15,
                    variantThreedXaxis : true,
                    variantThreedYaxis : true,
                    bevelled : false,
                    axes : true,
                    tooltips: chartTooltipArr,
                    tooltipsEvent : 'onmousemove',
                     xaxisTitle : **'Date',**
                    yaxisTitle : yAxisTitle,
                    xaxisTitleSize : legendFontSize,
                    yaxisTitleSize : legendFontSize,
                    xaxisLabelsSize : legendFontSize,
                    yaxisLabelsSize : legendFontSize,
                    yaxisTitlePos : 0.1,
                    colorsSequential : true,

                }
            });
            barGraph.draw();

Thanks

Solution

  • By the looks of the 3D style and some other cues, you're using quite an old version. Here's two modern-style 3D charts:

    https://www.rgraph.net/demos/bar-3d-effect-multi-row.html

    https://www.rgraph.net/demos/bar-ajax.html

    There's more examples in the download archive which are worth looking at.

    As for the problem with your chart, I think the easiest solution would be to set the textAccessible option to false:

    textAccessible: false,