An Example of a Google Bar Chart

HTML

<script src="https://www.google.com/jsapi"></script>
<div style="margin:50px;">
    <div id="cover"></div>
    <div id="chart_div"></div>
</div>
<div style="clear:both">
    <p>Make grey between point X and Y</p>
    <input id="startPos" type="number" value="0"/><br/>
    <input id="interval" type="number" value="10"/><br/>
    <input type="button" value="Confirm update" onclick="updateShader()" />
</div>

CSS

#cover {
    position:absolute;
    width:0px;
    height:124px;
    margin-top:38px;
    margin-left:73px;
    pointer-events:none;
    background: rgba(0, 0, 0, 0.1);
    z-index:2;
}
.google-visualization-tooltip {
    z-index:2;
}

JavaScript

function updateShader() {
    // gets the entered values from the fields
    var start = Math.round(parseInt(document.getElementById('startPos').value))
    var width = Math.round(parseInt(document.getElementById('interval').value))
    
    // draws the chart again with the entered filters
    drawBasic(start, width);

    //converts the entered values to ISH pixels    
    start = Math.round(start*5.125)
    width = Math.round(width*5.125)
    
    // special case when start = end point, so it will be grey on a little on both sides
    if (start == width) {
        start = start + 69
    }else{
        start = start + 73 
    }
        // changes the "cover-box" to fit the entered values
    document.getElementById('cover').style.marginLeft = start + "px";
    document.getElementById('cover').style.width = width - start + 73 + "px";
}

google.load('visualization', '1', {packages: ['corechart', 'line']});
google.setOnLoadCallback(drawBasic);

function drawBasic(a, b) {
    
    // Initiates all data
    var data = new google.visualization.DataTable();
    data.addColumn('number', 'X');
    data.addColumn('number', 'Dogs');
    data.addColumn('number', 'Dogs');
    // extra column for the filler-line (the grey one)
    data.addRows([
        [0, 0, null],
        [1, 10, null],
        [2, 23, null],
        [3, 17, null],
        [4, 18, null],
        [5, 9, null],
        [6, 11, null],
        [7, 27, null],
        [8, 33, null],
        [9, 40, null],
        [10, 32, null],
        [11, 35, null],
        [12, 30, null],
        [13, 40, null],
        [14, 42, null],
        [15, 47, null],
        [16, 44, null],
        [17, 48, null],
        [18, 52, null],
        [19, 54, null],
        [20, 42, null],
        [21, 55, null],
        [22, 56, null],
        [23, 57, null],
        [24, 60, null],
        [25, 50, null],
        [26, 52, null],
        [27, 51, null],
        [28, 49, null],
        [29, 53, null],
        [30, 55, null],
       ...