    <ol class="breadcrumb">
		<li><a href="#/">Dashboard</a></li>
		<li>Maps</li>
		<li class="active">Vector Maps</li>
	</ol>


<div class="container-fluid" ng-controller="VectorMapsController">

	<div class="alert alert-info">
		<h3>jQuery Vector Maps</h3>
		<p>JQVMap is a jQuery plugin that renders Vector Maps.  It uses resizable Scalable Vector Graphics (SVG) for modern browsers like Firefox, Safari, Chrome, Opera and Internet Explorer 9.</p>
		<br>
		<p><i class="ti ti-location-pin"></i> Download vector maps available for free <a href="http://jvectormap.com/maps/world/europe/">here</a></p>
	</div>

	<div data-widget-group="group1">
		<div class="row">
			<div class="col-md-12">
				<div class = "panel panel-transparent">
					<div class="panel-heading">
						<h2>World Map</h2>
					</div>
					<div class="panel-body">
						<div jvectormap data-options="worldmap" style="height: 400px;"></div>
					</div>
				</div>
			</div>
		</div>

		<div class="row">
			<div class="col-md-6">
				<div class="panel panel-transparent">
					<div class="panel-heading">
						<h2>USA</h2>
					</div>
					<div class="panel-body">
						<div jvectormap data-options="usa" style="height: 350px;"></div>
						</div>
				</div>
			</div>

			<div class="col-md-6">
				<div class="panel panel-transparent">
					<div class="panel-heading">
						<h2>China</h2>
					</div>
					<div class="panel-body">
						<div jvectormap data-options="china" style="height: 350px;"></div>
					</div>
				</div>
			</div>
		</div>

		<div class="row">
			<div class="col-md-6">
				<div class="panel panel-transparent">
					<div class="panel-heading">
						<h2>Europe</h2>
					</div>
					<div class="panel-body">
						<div jvectormap data-options="europe" style="height: 350px;"></div>
					</div>
				</div>
			</div>

			<div class="col-md-6">
				<div class="panel panel-transparent">
					<div class="panel-heading">
						<h2>India</h2>
						
					</div>
					<div class="panel-body">
						<div jvectormap data-options="india" style="height: 350px;"></div>
					</div>
				</div>
			</div>
		</div>

		<div class="row">
			<div class="col-md-6">
				<div class="panel panel-transparent">
					<div class="panel-heading">
						<h2>Denmark</h2>
					</div>
					<div class="panel-body">
						<div jvectormap data-options="denmark" style="height: 350px;"></div>
					</div>
				</div>
			</div>

			<div class="col-md-6">
				<div class="panel panel-transparent">
					<div class="panel-heading">
						<h2>Netherlands</h2>
					</div>
					<div class="panel-body">
						<div jvectormap data-options="netherlands" style="height: 350px;"></div>
					</div>
				</div>
			</div>
		</div>


		<div class="row">
			<div class="col-md-6">
				<div class="panel panel-transparent">
					<div class="panel-heading">
						<h2>Sweden</h2>
					</div>
					<div class="panel-body">
						<div jvectormap data-options="sweden" style="height: 350px;"></div>
					</div>
				</div>
			</div>
			<div class="col-md-6">
				<div class="panel panel-transparent">
					<div class="panel-heading">
						<h2>New York</h2>
					</div>
					<div class="panel-body">
						<div jvectormap data-options="usaNy" style="height: 350px;"></div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div> <!-- container-fluid -->

