Rotating map using openlayer3 is not working

I am looking for a way to rotate the map which does not contain tile in google map api. Can i use openlayer3 to do this if yes why the sample demonstrated is not working for the below example

<!DOCTYPE html>
<html>
<head>
    <title>Rotation example</title>
    <script src="https://code.jquery.com/jquery-1.11.2.min.js"></script>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="http://openlayers.org/en/v3.11.2/css/ol.css" type="text/css">
    <script src="http://openlayers.org/en/v3.11.2/build/ol.js"></script>

</head>
<body>
<div class="container-fluid">

    <div class="row-fluid">
        <div class="span12">
            <div id="map" class="map"></div>
        </div>
    </div>

</div>
<script>
    var map = new ol.Map({
        layers: [
            new ol.layer.Tile({
                source: new ol.source.OSM()
            })
        ],
        target: 'map',
        controls: ol.control.defaults({
            attributionOptions: /** @type {olx.control.AttributionOptions} */ ({
                collapsible: false
            })
        }),
        view: new ol.View({
            center: [1.353199,103.986908],
            rotation: Math.PI / 6,
            zoom: 10
        })
    });

</script>
</body>
</html>

what i am doing wrong here why the map itself is not display i am very new to this please say where i am going wrong

Solution

The code there works perfectly fine. The map is loading and you can also see that it is rotated as desired, because in the top right corner it shows the control to reset the rotation. This button is only visible when the map is rotated.

It looks like it's not loading, because the center seems to be specified in a wrong way, so it shows a place on the map where there is only water. The coordinates that you specify as the center of the map must be transformed for the projection of the map. Try to set the map view like this:

view: new ol.View({
    center: ol.proj.fromLonLat([103.986908, 1.353199]),
    rotation: Math.PI / 6,
    zoom: 10,
})