Browse Source

Added a line chart displaying the average cost and best cost.

pull/18/head
jrtechs 5 years ago
parent
commit
9f0bf214b9
1 changed files with 83 additions and 29 deletions
  1. +83
    -29
      geneticAlgorithm/geneticAlgo.html

+ 83
- 29
geneticAlgorithm/geneticAlgo.html View File

@ -114,11 +114,13 @@
const naturalSelection = function(population, keepNumber, fitnessFunction) const naturalSelection = function(population, keepNumber, fitnessFunction)
{ {
let fitnessArray = []; let fitnessArray = [];
let total = 0;
for(let i = 0; i < population.length; i++) for(let i = 0; i < population.length; i++)
{ {
const fitness = fitnessFunction(population[i]); const fitness = fitnessFunction(population[i]);
console.log(fitness); console.log(fitness);
fitnessArray.push({fit:fitness, chrom: population[i]}); fitnessArray.push({fit:fitness, chrom: population[i]});
total+= fitness;
} }
fitnessArray.sort(predicateBy("fit")); fitnessArray.sort(predicateBy("fit"));
@ -130,7 +132,7 @@
{ {
survivors.push(fitnessArray[i].chrom); survivors.push(fitnessArray[i].chrom);
} }
return {survivors: survivors, bestFit: bestFitness, bestChrom: bestChromosome};
return {average: total/population.length, survivors: survivors, bestFit: bestFitness, bestChrom: bestChromosome};
}; };
const blendGene = function(gene1, gene2, blendCoef) const blendGene = function(gene1, gene2, blendCoef)
@ -254,12 +256,10 @@
bestCostG = Number.MAX_VALUE, bestChromosomeG = genericChromosomeG; bestCostG = Number.MAX_VALUE, bestChromosomeG = genericChromosomeG;
const runGeneticOptimizationforGraph = function() const runGeneticOptimizationforGraph = function()
{ {
let generationResult = naturalSelection(populationG, keepNumberG, costFunctionG); let generationResult = naturalSelection(populationG, keepNumberG, costFunctionG);
stats.push([generationG, generationResult.bestFit, generationResult.average]);
if(bestCostG > generationResult.bestFit) if(bestCostG > generationResult.bestFit)
{ {
bestChromosomeG = generationResult.bestChrom; bestChromosomeG = generationResult.bestChrom;
@ -269,7 +269,6 @@
generationG++; generationG++;
console.log("Generation " + generationG + " Best Cost: " + bestCostG); console.log("Generation " + generationG + " Best Cost: " + bestCostG);
console.log(generationResult); console.log(generationResult);
@ -279,12 +278,13 @@
mutatePopulation(populationG, mutationRateG); mutatePopulation(populationG, mutationRateG);
createGraph(); createGraph();
}; };
let stats = [];
const createGraph = function() const createGraph = function()
{ {
var dataPoints = [];
var dataPoints = [];
console.log(dataPoints); console.log(dataPoints);
@ -307,6 +307,29 @@
var chart = new google.visualization.ScatterChart(document.getElementById('chart_div')); var chart = new google.visualization.ScatterChart(document.getElementById('chart_div'));
chart.draw(data, options); chart.draw(data, options);
//line chart stuff
var line_data = new google.visualization.DataTable();
line_data.addColumn('number', 'Generation');
line_data.addColumn('number', 'Best');
line_data.addColumn('number', 'Average');
line_data.addRows(stats);
console.log(stats);
var lineChartOptions = {
hAxis: {
title: 'Generation'
},
vAxis: {
title: 'Cost'
},
colors: ['#AB0D06', '#007329']
};
var chart = new google.visualization.LineChart(document.getElementById('line_chart'));
chart.draw(line_data, lineChartOptions);
}; };
@ -328,31 +351,63 @@
generationG = 0; generationG = 0;
function resetPopulation()
function verifyForm()
{ {
if(Number($("#populationSize").val()) <= 1)
{
alert("Population size must be greater than one.");
return false;
}
if(Number($("#mutationRate").val()) > 1 ||
Number($("#mutationRate").val()) < 0)
{
alert("Mutation rate must be between zero and one.");
return false;
}
autoRunning = false;
$("#runAutoOptimizer").val("Auto Run");
if(Number($("#survivalSize").val()) < 0)
{
alert("Survival size can't be less than one.");
return false;
}
if(Number($("#newBlood").val()) < 0)
{
alert("New organisms can't be a negative number.");
return false;
}
return true;
}
populationSizeG = $("#populationSize").val();
mutationRateG = $("#mutationRate").val();
keepNumberG = $("#survivalSize").val();
newBloodNumberG = $("#newBlood").val();
generationG = 0;
function resetPopulation()
{
if(verifyForm())
{
stats = [];
autoRunning = false;
$("#runAutoOptimizer").val("Auto Run");
populationG = createRandomPopulation(genericChromosomeG, populationSizeG);
createGraph();
populationSizeG = $("#populationSize").val();
mutationRateG = $("#mutationRate").val();
keepNumberG = $("#survivalSize").val();
newBloodNumberG = $("#newBlood").val();
generationG = 0;
populationG = createRandomPopulation(genericChromosomeG, populationSizeG);
createGraph();
}
} }
populationG = createRandomPopulation(genericChromosomeG, populationSizeG); populationG = createRandomPopulation(genericChromosomeG, populationSizeG);
window.onload = function () {
window.onload = function (){
google.charts.load('current', {packages: ['corechart', 'line']});
google.charts.load('current', {'packages':['corechart']}).then(function() google.charts.load('current', {'packages':['corechart']}).then(function()
{ {
createGraph(); createGraph();
}) })
}; };
@ -382,8 +437,6 @@
runAutoOptimizer(); runAutoOptimizer();
} }
//runGeneticOptimization(exampleOrganism, basicCostFunction, 100, 50, 0.01, 0.3, 20, 10); //runGeneticOptimization(exampleOrganism, basicCostFunction, 100, 50, 0.01, 0.3, 20, 10);
</script> </script>
@ -394,6 +447,8 @@
<body> <body>
<div id="chart_div" style="width: 900px; height: 500px;"></div> <div id="chart_div" style="width: 900px; height: 500px;"></div>
<div id="line_chart"></div>
<input class='btn btn-primary' id="runOptimizer" onclick='runGeneticOptimizationforGraph()' type="button" value="Next Generation"> <input class='btn btn-primary' id="runOptimizer" onclick='runGeneticOptimizationforGraph()' type="button" value="Next Generation">
<input class='btn btn-primary' id="runAutoOptimizer" onclick='startStopAutoRun()' type="button" value="Auto Run"> <input class='btn btn-primary' id="runAutoOptimizer" onclick='startStopAutoRun()' type="button" value="Auto Run">
@ -401,32 +456,31 @@
<div class="card-header"> <div class="card-header">
<h2>Population Variables</h2> <h2>Population Variables</h2>
</div> </div>
<div class="card-body">
<form class="card-body">
<div class="row p-2"> <div class="row p-2">
<div class="col"> <div class="col">
<label for="populationSize">Population Size</label> <label for="populationSize">Population Size</label>
<input type="text" class="form-control" id="populationSize" placeholder="Population Size" required>
<input type="text" class="form-control" value="100" id="populationSize" placeholder="Population Size" required>
</div> </div>
<div class="col"> <div class="col">
<label for="populationSize">Survival Size</label> <label for="populationSize">Survival Size</label>
<input type="text" class="form-control" id="survivalSize" placeholder="Survival Size" required>
<input type="text" class="form-control" value="20" id="survivalSize" placeholder="Survival Size" required>
</div> </div>
</div> </div>
<div class="row p-2"> <div class="row p-2">
<div class="col"> <div class="col">
<label for="populationSize">Mutation Rate</label> <label for="populationSize">Mutation Rate</label>
<input type="text" class="form-control" id="mutationRate" placeholder="Mutation Rate" required>
<input type="text" class="form-control" value="0.03" id="mutationRate" placeholder="Mutation Rate" required>
</div> </div>
<div class="col"> <div class="col">
<label for="populationSize">New Organisms Per Generation</label> <label for="populationSize">New Organisms Per Generation</label>
<input type="text" class="form-control" id="newBlood" placeholder="New Organisms" required>
<input type="text" class="form-control" value="5" id="newBlood" placeholder="New Organisms" required>
</div> </div>
</div> </div>
<br> <br>
<input class='btn btn-primary' id="reset" onclick='resetPopulation()' type="button" value="Reset Population"> <input class='btn btn-primary' id="reset" onclick='resetPopulation()' type="button" value="Reset Population">
</div>
</form>
</div> </div>
</body> </body>

Loading…
Cancel
Save