Уменьшение разрыва между полосками в амбразурах Последовательная гистограмма

Question

Использование с использованием amcharts плагин для создания гистограммы. Есть ли какие-либо способы, я могу уменьшить расстояние/зазор между полосками как x a y axis на графике. Here is the fiddle

Код

var chart = AmCharts.makeChart("chartdiv", { 
    "theme": "light", 
    "type": "serial", 
    "dataProvider": [{ 
     "name": "John", 
     "startTime": 0, 
     "endTime": 11, 
     "color": "#FF0F00" 
    }, { 
     "name": "Joe", 
     "startTime": 0, 
     "endTime": 13, 
     "color": "#FF9E01" 
    }, { 
     "name": "Susan", 
     "startTime": 0, 
     "endTime": 18, 
     "color": "#F8FF01" 
    }, { 
     "name": "Eaton", 
     "startTime": 0, 
     "endTime": 19, 
     "color": "#04D215" 
    }], 
    "valueAxes": [{ 
     "axisAlpha": 0, 
     "gridAlpha": 0.1 
    }], 
    "startDuration": 1, 
    "graphs": [{ 
     "balloonText": "<b>[[category]]</b><br>starts at [[startTime]]<br>ends at [[endTime]]", 
     "colorField": "color", 
     "fillAlphas": 0.8, 
     "lineAlpha": 0, 
     "openField": "startTime", 
     "type": "column", 
     "valueField": "endTime" 
    }], 
    "rotate": true, 
    "columnWidth": 0.2, 
    "categoryField": "name", 
    "categoryAxis": { 
     "gridPosition": "start", 
     "axisAlpha": 0, 
     "gridAlpha": 0.1, 
     "position": "left" 
    }, 
    "export": { 
     "enabled": true 
    } 
}); 

Answer 1

Чтобы сделать график меньше, и уменьшить маржу, вы должны изменить columnWidth и высоту в CSS:

fiddle

Изменяя высоту графика на 200px:

#chartdiv { 
    width : 100%; 
    height : 200px; 
} 

И установка ColumnWidth к 0.8, я думаю, вы получите то, что вы хотите :)

добавление

Чтобы удалить горизонтальные серые линии, которые вы можете установить gridAlpha к 0 в categoryAxis

"categoryAxis": { 
    "gridPosition": "start", 
    "axisAlpha": 0, 
    "gridAlpha": 0, 
    "position": "left" 
} 

Обновлено скрипку