Edit in JSFiddle

$(document).ready(function() {
    var i = 0;
    var data = [[]];
    var renderer = function() {
        //create random data needed for the initial plot
        for (i = 0; i < 15; i++) {
            data[0].push([i, Math.random()]);
        }
        i = 15;
        return data;
    };
    //create the chart
    var plot1 = $.jqplot('chart1', [[]], {
        dataRenderer: renderer,
        seriesDefaults: {
            rendererOptions: {
                smooth: true,
                animation: {
                    show: true
                }
            }
        }
    });

    //in every 5s interval replot the graph with newData (new random data)          
    var intervalId = setInterval(function() {
        var newData = new Array();
        newData = data;
        //remove the first element from the data array
        newData[0].shift();
        //add a new element to the end of the array
        newData[0].push([i++, Math.random()]);
        plot1.series[0].data = newData[0];
        plot1.resetAxesScale();
        plot1.replot();
    }, 5000);
});

//toggle the css class of the chart on button click
$("#flipbutton").click(function() {
    $("#chart1").toggleClass("vertical");
});
<INPUT TYPE=SUBMIT VALUE="Flip orientation" id="flipbutton">
<div id="chart1"></div>
#flipbutton{
    position: relative;
    top: 5px;
    left: 5px;
}

#chart1{
    height: 300px;
    width: 700px;
    position: relative;
}

.vertical{
    position: relative;
    top: 200px ;
    -webkit-transform: rotate(90deg);  /* Safari 3.1+, Chrome */
    -moz-transform: rotate(90deg);  /* Firefox 3.5-15 */
    -ms-transform: rotate(90deg);  /* IE9 */
    -o-transform: rotate(90deg);  /* Opera 10.5-12.00 */
    transform: rotate(90deg);  /* Firefox 16+, Opera 12.50+ */
}

.vertical .jqplot-xaxis-tick{
    -webkit-transform: rotate(-90deg);  /* Safari 3.1+, Chrome */
    -moz-transform: rotate(-90deg);  /* Firefox 3.5-15 */
    -ms-transform: rotate(-90deg);  /* IE9 */
    -o-transform: rotate(-90deg);  /* Opera 10.5-12.00 */
    transform: rotate(-90deg);  /* Firefox 16+, Opera 12.50+ */
}

.vertical .jqplot-yaxis-tick{
    -webkit-transform: rotate(-90deg);  /* Safari 3.1+, Chrome */
    -moz-transform: rotate(-90deg);  /* Firefox 3.5-15 */
    -ms-transform: rotate(-90deg);  /* IE9 */
    -o-transform: rotate(-90deg);  /* Opera 10.5-12.00 */
    transform: rotate(-90deg);  /* Firefox 16+, Opera 12.50+ */
}

External resources loaded into this fiddle: