extruded cylinder

HTML

<!DOCTYPE html>
<html lang="en">
	<head>
		<title>three.js webgl - geometry - extrude shapes from geodata</title>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
		<style>
		body {
			color: #ffffff;
			font-family: Monospace;
			font-size: 13px;
			text-align: center;
			font-weight: bold;
			background-color: #000000;
			margin: 0px;
			overflow: hidden;
		}

		#info {
			position: absolute;
			top: 0px;
			width: 100%;
			padding: 5px;
		}

		a {
			color: #ffffff;
		}
		</style>
	</head>

	<body>

		<div id="container"></div>
		<div id="info">
			<a href="http://threejs.org" target="_blank" rel="noopener">three.js</a> - Shapes Extrusion via Geo Data
		</div>

		<script type="text/javascript" src="http://threejs.org/build/three.js"></script>
		<script src="http://threejs.org/js/controls/OrbitControls.js"></script>
		<script src="http://threejs.org/js/libs/stats.min.js"></script>

		<script>
			// From d3-threeD.js
			/* This Source Code Form is subject to the terms of the Mozilla Public
			 * License, v. 2.0. If a copy of the MPL was not distributed with this file,
			 * You can obtain one at http://mozilla.org/MPL/2.0/. */

			function d3threeD( exports ) {

				var DEGS_TO_RADS = Math.PI / 180, UNIT_SIZE = 100;
				var DIGIT_0 = 48, DIGIT_9 = 57, COMMA = 44, SPACE = 32, PERIOD = 46, MINUS = 45;

				exports.transformSVGPath = function transformSVGPath( pathStr ) {

					var path = new THREE.ShapePath();

					var idx = 1, len = pathStr.length, activeCmd,
						x = 0, y = 0, nx = 0, ny = 0, firstX = null, firstY = null,
						x1 = 0, x2 = 0, y1 = 0, y2 = 0,
						rx = 0, ry = 0, xar = 0, laf = 0, sf = 0, cx, cy;

					function eatNum() {

						var sidx, c, isFloat = false, s;

						// eat delims

						while ( idx < len ) {

							c = pathStr.charCodeAt( idx );

							if ( c !== COMMA && c !== SPACE ) break;

							idx ++;

						}

						if ( c === MINUS )...