凹凸条形图挂在y轴上

时间:2015-09-10 05:40:51

标签: dimple.js

我有一个凹陷图表,条形图在y轴上重叠。我认为问题在于它是一个时间轴。我已经包含了生成以下代码的代码。如何创建填充/边距以将条推得更近?

enter image description here

function build_chart() {
    data = response_data[frequency];
    svg = dimple.newSvg("#chartContainer", $(document).width() * .90, $(document).height() *.65);
    var chart = new dimple.chart(svg, data);
    chart.setBounds(60, 40, "80%", "80%");

    var x = chart.addTimeAxis("x", "begin_date", "%Y-%m-%dT%H:%M:%S", output_date_format());
    x.addOrderRule("begin_date");
    x.showGridlines = true;

    var y = chart.addMeasureAxis("y", "count_session_total");
    y.showGridlines = true;
    y.tickFormat = ',.0f';
    y.title = '';

    if(data) {
        var s1 = chart.addSeries(null, dimple.plot.bar);
        var bar_length = $(document).width() * .8 / data.length;
        x.floatingBarWidth = bar_length;
    }
    chart.draw(1500);
}

1 个答案:

答案 0 :(得分:0)

以下是我能够将其发挥作用的方式:

var chart_width = chart._widthPixels();
var bars = data.length * 1.2;
x.floatingBarWidth = chart_width / bars;

x.title = '';
if(frequency == 'daily') {
    x.overrideMin = moment(data[0]['Date']).subtract(1, 'days');
    x.overrideMax = moment(data[data.length - 1]['Date']).add(1, 'days');
} else if(frequency == 'weekly') {
    x.title = 'Week Beginning'
    x.overrideMin = moment(data[0]['Date']).subtract(7, 'days');
    x.overrideMax = moment(data[data.length - 1]['Date']).add(7, 'days');
} else if(frequency == 'monthly') {
    x.overrideMin = moment(data[0]['Date']).subtract(1, 'months');
    x.overrideMax = moment(data[data.length - 1]['Date']).add(1, 'months');
    x.floatingBarWidth = x.floatingBarWidth * .75;
}