PlaneGeometryを回転させて表示するには？

JavaScript/Three.js初心者です。

Three.jsに関する質問です。

下記のように2次元平面のオブジェクト(plane)を作成し、

JavaScript
var planeGeo = new THREE.PlaneGeometry(10,10,10);
var planeMesh = new THREE.MeshBasicMaterial({color: 0x333333, side: THREE.DoubleSide});
var plane = new THREE.Mesh( planeGeo, planeMesh );

planeをy軸で90度回転させて表示させようとしております。

http://yomotsu.net/blog/2012/12/01/create-terrain-with-threejs.html
https://www.ibm.com/developerworks/jp/web/library/wa-webgl2/

上記のようなサイトを参考にして

JavaScript
plane.rotation.y = Math.Pi/2;

と書いてみたのですが、planeが表示されなくなります。
(この1行をコメントアウトすると、普通にplaneは表示されるのですが…)

rotationって関数が変わってしまったとかでしょうか...？
うまく調べられず困っております。。。
どなたかお力添えいただけないでしょうか？？

ご参考までに、以下にmain.jsとindex.htmlを掲載いたします。

##main.js

javascript
var renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
renderer.setPixelRatio(window.devicePixelRatio);

//camera
var fov = 75;
var aspect = window.innerWidth / window.innerHeight;
var near = 0.1;
var far = 1000;
var camera = new THREE.PerspectiveCamera(fov, aspect, near, far);
var camera_position_x0 = 0;
var camera_position_y0 = 0;
var camera_position_z0 = -10.0;
camera.position.set(camera_position_x0,camera_position_y0,camera_position_z0);

var controls = new THREE.OrbitControls(camera, renderer.domElement);

var scene = new THREE.Scene();

document.body.appendChild(renderer.domElement);

//Planeを回転させて表示
var planeGeo = new THREE.PlaneGeometry(10,10,10);
var planeMesh = new THREE.MeshBasicMaterial({color: 0x333333, side: THREE.DoubleSide});
var plane = new THREE.Mesh( planeGeo, planeMesh );
plane.position.set(2.0, 0, 0.0);
//plane.rotation.y = Math.Pi/2; ←★ここのコメントアウトをなくすと表示されなくなります…！★
scene.add( plane );

//Light
var light = new THREE.DirectionalLight(0xffffff);
light.position.set(0,30,-50);
scene.add(light);

//環境光
var ambient = new THREE.AmbientLight(0x333333);
scene.add(ambient);

//レンダリング
function renderRender() {
    renderer.render(scene, camera);
    requestAnimationFrame(animate);
}

//animate
function animate(){
  renderRender()
}

animate();

##index.html

html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0, shrink-to-fit=no">
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<title>teraVR360</title>
<style rel="stylesheet" href="css/index.css"></style>
<script src="js/three.min.js"></script>
<script src="js/OrbitControls.js"></script>
</head>

<body>
<script>
(function () {
    'use strict';

    var query = location.search.slice(1);

    function loadScript(fileName) {
        fileName = fileName || 'main';
        var script = document.createElement('script');
        script.src = 'js/' + fileName + '.js';
        document.head.appendChild(script);
    }

    loadScript(query);
}());
</script>
</body>
</html>