Estimating Pi using the Monte Carlo Method

Developer
Size
3,025 Kb
Views
32,384

How do I make an estimating pi using the monte carlo method?

To celebrate Pi Day, here is a demo of how to estimate the value of Pi using the Monte Carlo method - generate a large number of random points and see how many fall in the circle enclosed by the unit square.This demo is originally from https://academo.org.. What is a estimating pi using the monte carlo method? How do you make a estimating pi using the monte carlo method? This script and codes were developed by Ed Ball on 12 November 2022, Saturday.

Estimating Pi using the Monte Carlo Method Previews

Estimating Pi using the Monte Carlo Method - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Estimating Pi using the Monte Carlo Method</title> <link rel='stylesheet prefetch' href='https://academo.org/scss/main.css?v=1457985409494'> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div id="demo">
</div>
<div id="ui-container">
</div>
<a id="academo-banner" href="https://academo.org/demos/estimating-pi-monte-carlo/" target="_blank">Find out more at Academo.org</a> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src='https://academo.org/js/demoConcat.js?v=1457985409494'></script>
<script src='http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML'></script>
<script src='https://academo.org/js/lib/d3.v3.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

Estimating Pi using the Monte Carlo Method - Script Codes CSS Codes

canvas { position:absolute; left:50%; margin-left:-250px; top:50%; margin-top:-250px; display:block;
}

Estimating Pi using the Monte Carlo Method - Script Codes JS Codes

/* This code comes from Academo.org */
var demo = new Demo({	ui: {	addOne: {	title: "Add points one-by-one",	type: "button"	},	animate: {	title: "Animate",	value: false,	},	speed: {	title: "Speed",	value: 1,	range: [5, 100],	resolution: 1,	input: "hidden",	},	reset: {	title: "Reset",	type: "button"	},	},	animateID: null,	totalPoints: 0,	innerPoints: 0,	radius: 250,	init: function(){	$('<canvas>').attr({	id: "my-canvas", height: "500px", width: "500px",	}).css({	width: "500px",	"height": "500px",	"display": "block",	"border": "solid 1px #CCC"	}).appendTo('#demo');	this.scale = d3.scale.linear() .domain([-1, 1]) .range([0, 500]); this.canvas = document.getElementById("my-canvas");	this.context = this.canvas.getContext("2d");	this.initCanvas();	$("#ui-container").prepend("<div class='interface' id='js-points-data'></div>");	$("#js-points-data").append("Total Number of points: <span class='js-total-points'>0</span><br />");	$("#js-points-data").append("Points within circle: <span class='js-inner-points'>0</span><br />");	$("#js-points-data").append("Pi estimation: <span class='js-pi-estimation'></span><br />");	},	initCanvas: function(){	this.context.clearRect(0,0,500,500);	this.context.strokeStyle = "#999";	this.context.beginPath();	this.context.arc(this.scale(0), this.scale(0), this.radius, 0, 2 * Math.PI);	this.context.stroke();	},	animate: function(){	this.animateID = window.requestAnimationFrame(this.animate.bind(this));	this.update();	},	reset: function(){	this.totalPoints = 0;	this.innerPoints = 0;	this.updateDisplay();	},	updateDisplay: function(){	$(".js-inner-points").html(this.innerPoints);	$(".js-total-points").html(this.totalPoints);	var piEstimate = (4 * this.innerPoints / this.totalPoints).toFixed(5);	if (this.totalPoints == 0){	piEstimate = "";	}	$(".js-pi-estimation").html(piEstimate);	},	update: function(e){	if (e == "speed"){	} else if (e == "animate" && this.ui.animate.value == true) {	this.animate();	} else if (e == "animate" && this.ui.animate.value == false) {	window.cancelAnimationFrame(this.animateID);	} else if (e == "reset") {	this.initCanvas();	this.reset();	} else {	if (e == "addOne"){	var numberToAdd = 1;	} else {	var numberToAdd = this.ui.speed.value;	}	for (var i = 0 ; i < numberToAdd ; i++){	var randomX = Math.random() * 2 - 1;	var randomY = Math.random() * 2 - 1;	this.context.beginPath();	if (Math.pow(this.scale(randomX) - this.scale(0), 2) + Math.pow(this.scale(randomY) - this.scale(0), 2) > Math.pow(this.radius, 2)){	this.context.fillStyle = "blue";	} else {	this.context.fillStyle = "red";	this.innerPoints++;	}	this.context.fillRect(this.scale(randomX),this.scale(randomY),1,1);	this.totalPoints++;	this.updateDisplay();	}	}	}
});
Estimating Pi using the Monte Carlo Method - Script Codes
Estimating Pi using the Monte Carlo Method - Script Codes
Home Page Home
Developer Ed Ball
Username edball
Uploaded November 12, 2022
Rating 3
Size 3,025 Kb
Views 32,384
Do you need developer help for Estimating Pi using the Monte Carlo Method?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Ed Ball (edball) Script Codes
Create amazing blog posts with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!