d3.js Line Chart Custom x-axis

250 views Asked by At

I have drawn a line chart with d3.js but the problem is that, for x-axis, the months are appearing multiple times. I just need the month once in my chart.

This is the final output

    [{
        "container": 'login-growth-chart',
        "url": "dashboard/logingrowthchart",
        "chart": drawLineChart,
        "options": {
            yAxis: {
                'axisLabel': 'Total amount',
                'axisLabelDistance': 40,
                'tickFormat': d3.format('d')
            },
            xAxis: {
                'tickFormat': function (d) {
                    return d3.time.format("%B %d")(new Date(d))
                }
            }
        }
    }];

     jQuery.each(charts, function (i, d) {
        jQuery.ajax({
         url: Drupal.settings.basePath + d.url,
         dataType: "json",
         success: function (data) {
            jQuery('#' + d.container).empty();
            d.chart(data, d.container, d.options);
         },
         beforeSend: function () {
            jQuery('#' + d.container).html('<div class="ajax-loading"></div>');
         },
         error: function (xmlhttp) {
            jQuery('#' + d.container).prepend('An Error Occured');
            console.log(xmlhttp);
         }
       });
     });
0

There are 0 answers