如何在块中间移动vAxis值

Question

我在这里有我的googleCombot图表，我希望我的vAxis（垂直轴[0,1,2,3,4,5,6]）值位于块的中间，而不是坐在线上。我怎样才能实现它并让我的价值观在范围内？

这是想要实现的结果

这是我的小提琴

function drawChart () {
    var data = new google.visualization.DataTable();
    data.addColumn('number', 'x');
    data.addColumn('number', 'y');
    data.addColumn('number', 'color band 1');
    data.addColumn('number', 'color band 2');
    data.addColumn('number', 'color band 3');
    data.addColumn('number', 'color band 4');
    data.addColumn('number', 'color band 5');
    
    var vticks = [];
    var weight = [1,3,2,7,4,6];
    var hticks = [];
    var i;
    for(var i = 0; i< weight.length; i++){ 
      hticks.push(i+1);
    }
    var vticksMin = vticks[0];
    var vticksMax = vticks[vticks.length - 1];
    var br = 1, by = 1, ty = 1, tr = 1, mg = 3;
    for (i = 0; i < 7; i++){
      vticks.push(i);
    }
	
    for (var i = 1; i < weight.length+1; i++) {
    
        data.addRow([i, parseInt(weight[i-1]), br, by,mg,ty,tr]);
    }

	var view = new google.visualization.DataView(data);
	view.setColumns([0,1, {
		type: 'string',
		role: 'annotation',
		calc: function (dt, row) {
			return dt.getValue(row, 1).toString();
		}
	}, 2, 3,4, 5,6]);
    
    var chart = new google.visualization.ComboChart(document.getElementById('chart_div'));
    
    chart.draw(view, {
        height: 700,
        width: 900,
        isStacked: true,
        hAxis: {
	            ticks: hticks
        },
        vAxis: {
	            viewWindow: {
	                min: vticksMin,
	                max: vticksMax
	            },
	            ticks: vticks
        },
        series: {
            0: {
                type: 'line',
    			color: '#000'
            },
            1: {
    			areaOpacity: 0.75,
    			color: '#E91818',
                lineWidth: 0,
                type: 'area',
                visibleInLegend: false,
                enableInteractivity: false
            },
            2: {
    			areaOpacity: 0.7,
    			color: '#FFD91E',
                lineWidth: 0,
                type: 'area',
                visibleInLegend: false,
                enableInteractivity: false
            },
            3: {
    			areaOpacity: 0.7,
    			color: '#00D717',
                lineWidth: 0,
                type: 'area',
                visibleInLegend: false,
                enableInteractivity: false
            },
            4: {
    			areaOpacity: 0.7,
    			color: '#FFD91E',
                lineWidth: 0,
                type: 'area',
                visibleInLegend: false,
                enableInteractivity: false
            },
            5: {
    			areaOpacity: 0.75,
    			color: '#E91818',
                lineWidth: 0,
                type: 'area',
                visibleInLegend: false,
                enableInteractivity: false
            }
        }
    });
}


google.load('visualization', '1', {packages: ['corechart'], callback: drawChart});

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<div id="chart_div"></div>
<div id="creativeCommons" style="text-align: center; width: 400px;">
    <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/3.0/deed.en_US"><img alt="Creative Commons License" style="border-width:0" src="http://i.creativecommons.org/l/by-nc-sa/3.0/88x31.png" /></a><br /><span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/InteractiveResource" property="dct:title" rel="dct:type">Code to add colored horizontal bands as a chart background</span> by <span xmlns:cc="http://creativecommons.org/ns#" property="cc:attributionName">Jonathan Ngbonga</span> is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/3.0/deed.en_US">Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License</a>.
</div>