<script type="text/javascript">

	//API_KEY
	/* با مراجعه به پنل کاربری خود می توانید کلید دسترسی لازم برای نمایش نقشه را ایجاد نمائید
	 * توجه Ùرمائید کلید دسترسی ای که در پنل خود برای نمایش نقشه ایجاد میکنید حتما از نوع نمایش نقشه وب باشد
	 *
	 * https://platform.neshan.org/panel/api-key
	 * 
	 *  */
	const API_KEY = "web.36050f03bb5b4af3998b2ab203b22aee"
	
	// get map dom element
	const mapContainer = document.getElementById("neshanMapContainer");
	
	// map properties
	/* حداقل اندازه نقشه با تغییر دو عبارت زیر می توانید حداقل طول و عرض نمایش نقشه را عوض کنید */
	const neshanMapWidth = "400px";
	const neshanMapHeight = "400px";
	
	mapContainer.style.minHeight = neshanMapWidth;
	mapContainer.style.minWidth = neshanMapHeight;
	
	
	/* رنگ آیکون مرکز نقشه */
	const neshanMarkerColor = "#FF8330";
	
	/* موقعیت مرکز نقشه برای نمایش به کاربر و اÙزودن آیکون بر روی آن 
	 * 
	 * برای بدست آوردن مختصات مورد نظر خود می توانید به نقشه وب نشان مراجعه کنید با کلیک راست کردن بر روی محل مورد نظرتان گزینه "کپی مختصات این نقطه" انتخاب کنید
	 * تا برای شما مختصات در حاÙظه کپی شود و سپس مقادیر کپی شده را در قسمت زیر الصاق کنید
	 * 
	 * https://neshan.org/maps
	 * 
	 * */
	const mapCenterLocation = [35.699789639952414,51.33748508581425]  //latitude,longitude
	
	
	// show poi and traffic on map
	/* در صورتی که میخواید بر روی نقشه خود اطلاعات تراÙیکی به همراه مکان های مختلÙ مثل مغازه ها، مجتمع ها، Ùروشگاه ها، بیمارستان ها و ... نیز نمایش داده شوند کاÙیست مقادیر را مانند زیر تغییر نمائید */
	 
	//نمایش مکان های منتخب:
	 const poi = true;	 
	 //عدم نمایش مکان های منتخب:
	 //const poi = false;
	 
	 //نمایش تراÙیک
	 //const traffic= true;
	 //عدم نمایش تراÙیک
	 const traffic= false;
	 
	
	/* میزان زوم نقشه بر روی محل مرکز نقشه هر چقدر این مقدار بزرگ تر باشد به معنی این است که به سطح زمین نزدیکتر هستیم و محدوده کوچکتری را مشاهده میکنیم در نقشه */
	const mapZoom = 15;
	
	/* نوع نقشه در صورتی که می خواهید نقشه شما ظاهر دیگری داشته باشد می توانید این مقدار را عوض نمائید ، برای تغییر نوع نقشه چهار حالت در نظر گرÙته شده است */
	 const mapType = nmp_mapboxgl.Map.mapTypes.neshanVector; //نقشه با کاشی های برداری روز
	 //const mapType = nmp_mapboxgl.Map.mapTypes.neshanVectorNight;  // نقشه با کاشی های برداری شب
	 //const mapType = nmp_mapboxgl.Map.mapTypes.neshanRaster; // نقشه با کاشی های پیکسلی
	 //const mapType = nmp_mapboxgl.Map.mapTypes.neshanRasterNight; // نقشه با کاشی های پیکسلی در شب
	 
	
	// Create map object
	const map = new nmp_mapboxgl.Map({
		mapType: mapType,
		container: mapContainer,
		zoom: mapZoom,
		pitch: 0,
		center: mapCenterLocation.reverse(),
		minZoom: 2,
		maxZoom: 21,
		trackResize: true,
		mapKey: API_KEY,
		poi: poi,
		traffic: traffic,
		mapTypeControllerStatus: {
			show: true,
			position: 'bottom-right'
		}
	});

	// get user location on map 
	/* در صورتی که نیازی ندارید که موقعیت کاربر را دریاÙت کنید میتوانید کد های این قسمت را پاک نماید */
	map.addControl(new nmp_mapboxgl.GeolocateControl({
		positionOptions: {enableHighAccuracy: true},
		trackUserLocation: true,
		showUserHeading: true })
    );
	/* پایان قسمت کد های گرÙتن موقعیت کاربر  */

	
	// add marker to the map
	/* در صورتی که نیازی به اÙزودن مارکر بر روی نقشه خود ندارید می توانید کد های این قسمت را پاک نمائید  */
	const marker = new nmp_mapboxgl.Marker({
		color: neshanMarkerColor,
		draggable: false
		}).setLngLat(mapCenterLocation)
	.addTo(map)
	/* پایان قسمت کد های اÙزودن مارکر به نقشه  */
	

</script>