Simple genetic algorithm

Developer

Size

10,179 Kb

Views

2,024

Simple genetic algorithm Previews
Simple genetic algorithm HTML Codes
Simple genetic algorithm CSS Codes
Simple genetic algorithm JS Codes

How do I make an simple genetic algorithm?

簡単な遺伝アルゴリズムです。数桁の2進数を遺伝子とし、世代評価基準は10進数の値としています。新世代は前世代の　上位2つを組み合わせた子孫を2つ追加　下位2つを削除　他は残すとしています。. What is a simple genetic algorithm? How do you make a simple genetic algorithm? This script and codes were developed by Uriuriuriu on 10 January 2023, Tuesday.

Simple genetic algorithm Previews

Simple genetic algorithm - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>simple genetic algorithm</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.5/dat.gui.min.js"></script>
<!-- generation template -->
<script type="text/template" id="generation_template"> <div id='genes_<%= id %>' class="genes"> <h2 class='gTitle'><strong><%= ordinalID %></strong><br>generations</h2> <div class="gParent gene_disp_flg"> <h3>- parent</h3> </div> <div class="gChildren"> <h3 class="gene_disp_flg">- children</h3> <p class="avg_bigtext">AVG: <span id='avg_<%= id %>'></span></p> </div> <div class="gGenes"></div> </div>
</script>
<!-- progeny template -->
<script type="text/template" id="progeny_template"> <p class="gene_<%= id %> gene_disp_flg"><%= idFill %> : <strong><%= geneText %></strong> -- <%= scoreFill %></p> <p class="bar_graph"><span style="width:<%= percent %>%;"></span></p>
</script>
<!-- avg template -->
<script type="text/template" id="avg_template"> <p id="avg_<%= id %>" class="gene_disp_flg"><span><%= idFill %> : <%= avgFixed %></span></p> <p class="bar_graph"><span style="width:<%= percent %>%;"></span></p>
</script>
<!-- main html -->
<div id="avgs"></div>
<div id="text"></div>
<div id="menu"> <span id="menu_add">Induce the next generation!</span> <span id="menu_del">reset.</span>
</div> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.4.1/underscore-min.js'></script> <script src="js/index.js"></script>
</body>
</html>

Simple genetic algorithm - Script Codes CSS Codes

@import url(https://fonts.googleapis.com/css?family=Offside);
body { background-color: #131315; font-family: 'Offside', cursive;
}
* { padding: 0; margin: 0; font-size: 12px;
}
#avgs { position: fixed; font-size: 12px; color: #5ec2a5; top: 0; left: 0; height: 100%; background-color: rgba(0, 0, 0, 0.5); padding: 20px;
}
#avgs h3, #avgs p { min-width: 60px; border-left: 1px dotted;
}
#avgs span { -webkit-animation: text_in 0.25s ease-out;
}
#text { padding: 20px 20px 60px 120px;
}
#text .gTitle { border-right: double #5ec2a5 3px; padding-bottom: 4px; background-color: rgba(94, 194, 165, 0.15); line-height: 14px;
}
#text .gTitle strong { font-size: 24px; line-height: 24px;
}
#text div.genes { display: inline-block; font-size: 12px; color: #5ec2a5; vertical-align: top; padding: 2px; margin: 4px 12px 16px 0px; border-left: 1px dotted;
}
#text div.genes .gGenes p { -webkit-animation: gene_in 0.14s;
}
#text div.genes .gGenes p.gene_1 { -webkit-animation-delay: 0s;
}
#text div.genes .gGenes p.gene_2 { -webkit-animation-delay: 0.01s;
}
#text div.genes .gGenes p.gene_3 { -webkit-animation-delay: 0.02s;
}
#text div.genes .gGenes p.gene_4 { -webkit-animation-delay: 0.03s;
}
#text div.genes .gGenes p.gene_5 { -webkit-animation-delay: 0.04s;
}
#text div.genes .gGenes p.gene_6 { -webkit-animation-delay: 0.05s;
}
#text div.genes .gGenes p.gene_7 { -webkit-animation-delay: 0.06s;
}
#text div.genes .gGenes p.gene_8 { -webkit-animation-delay: 0.07s;
}
#text div.genes .gGenes p.gene_9 { -webkit-animation-delay: 0.08s;
}
#text div.genes .gGenes p.gene_10 { -webkit-animation-delay: 0.09s;
}
#text div.genes .gGenes p.gene_11 { -webkit-animation-delay: 0.1s;
}
#text div.genes .gGenes p.gene_12 { -webkit-animation-delay: 0.11s;
}
#text div.genes .gGenes p.gene_13 { -webkit-animation-delay: 0.12s;
}
#text div.genes .gGenes p.gene_14 { -webkit-animation-delay: 0.13s;
}
#text div.genes .gGenes p.gene_15 { -webkit-animation-delay: 0.14s;
}
#text div.genes .gGenes p.gene_16 { -webkit-animation-delay: 0.15s;
}
#text div.genes .gGenes p.gene_17 { -webkit-animation-delay: 0.16s;
}
#text div.genes .gGenes p.gene_18 { -webkit-animation-delay: 0.17s;
}
#text div.genes .gGenes p.gene_19 { -webkit-animation-delay: 0.18s;
}
#text div.genes .gGenes p.gene_20 { -webkit-animation-delay: 0.19s;
}
#text div.genes .gGenes p.gene_21 { -webkit-animation-delay: 0.2s;
}
#text div.genes .gGenes p.gene_22 { -webkit-animation-delay: 0.21s;
}
#text div.genes .gGenes p.gene_23 { -webkit-animation-delay: 0.22s;
}
#text div.genes .gGenes p.gene_24 { -webkit-animation-delay: 0.23s;
}
#text div.genes .gGenes p.gene_25 { -webkit-animation-delay: 0.24s;
}
#text div.genes .gGenes p.gene_26 { -webkit-animation-delay: 0.25s;
}
#text div.genes .gGenes p.gene_27 { -webkit-animation-delay: 0.26s;
}
#text div.genes .gGenes p.gene_28 { -webkit-animation-delay: 0.27s;
}
#text div.genes .gGenes p.gene_29 { -webkit-animation-delay: 0.28s;
}
#text div.genes .gGenes p.gene_30 { -webkit-animation-delay: 0.29s;
}
#text div.genes .gGenes p.gene_31 { -webkit-animation-delay: 0.3s;
}
#text div.genes .gGenes p.gene_32 { -webkit-animation-delay: 0.31s;
}
#text div.genes .gGenes p.gene_33 { -webkit-animation-delay: 0.32s;
}
#text div.genes .gGenes p.gene_34 { -webkit-animation-delay: 0.33s;
}
#text div.genes .gGenes p.gene_35 { -webkit-animation-delay: 0.34s;
}
#text div.genes .gGenes p.gene_36 { -webkit-animation-delay: 0.35s;
}
#text div.genes .gGenes p.gene_37 { -webkit-animation-delay: 0.36s;
}
#text div.genes .gGenes p.gene_38 { -webkit-animation-delay: 0.37s;
}
#text div.genes .gGenes p.gene_39 { -webkit-animation-delay: 0.38s;
}
#text div.genes .gGenes p.gene_40 { -webkit-animation-delay: 0.39s;
}
#text div.genes .gGenes p.gene_41 { -webkit-animation-delay: 0.4s;
}
#text div.genes .gGenes p.gene_42 { -webkit-animation-delay: 0.41s;
}
#text div.genes .gGenes p.gene_43 { -webkit-animation-delay: 0.42s;
}
#text div.genes .gGenes p.gene_44 { -webkit-animation-delay: 0.43s;
}
#text div.genes .gGenes p.gene_45 { -webkit-animation-delay: 0.44s;
}
#text div.genes .gGenes p.gene_46 { -webkit-animation-delay: 0.45s;
}
#text div.genes .gGenes p.gene_47 { -webkit-animation-delay: 0.46s;
}
#text div.genes .gGenes p.gene_48 { -webkit-animation-delay: 0.47s;
}
#text div.genes .gGenes p.gene_49 { -webkit-animation-delay: 0.48s;
}
#text div.genes .gGenes p.gene_50 { -webkit-animation-delay: 0.49s;
}
#text div.genes .gGenes p.gene_51 { -webkit-animation-delay: 0.5s;
}
#text div.genes .gGenes p.gene_52 { -webkit-animation-delay: 0.51s;
}
#text div.genes .gGenes p.gene_53 { -webkit-animation-delay: 0.52s;
}
#text div.genes .gGenes p.gene_54 { -webkit-animation-delay: 0.53s;
}
#text div.genes .gGenes p.gene_55 { -webkit-animation-delay: 0.54s;
}
#text div.genes .gGenes p.gene_56 { -webkit-animation-delay: 0.55s;
}
#text div.genes .gGenes p.gene_57 { -webkit-animation-delay: 0.56s;
}
#text div.genes .gGenes p.gene_58 { -webkit-animation-delay: 0.57s;
}
#text div.genes .gGenes p.gene_59 { -webkit-animation-delay: 0.58s;
}
#text div.genes .gGenes p.gene_60 { -webkit-animation-delay: 0.59s;
}
#text div.genes .gGenes p.gene_61 { -webkit-animation-delay: 0.6s;
}
#text div.genes .gGenes p.gene_62 { -webkit-animation-delay: 0.61s;
}
#text div.genes .gGenes p.gene_63 { -webkit-animation-delay: 0.62s;
}
#text div.genes .gGenes p.gene_64 { -webkit-animation-delay: 0.63s;
}
#text div.genes .gGenes p.gene_65 { -webkit-animation-delay: 0.64s;
}
#text div.genes .gGenes p.gene_66 { -webkit-animation-delay: 0.65s;
}
#text div.genes .gGenes p.gene_67 { -webkit-animation-delay: 0.66s;
}
#text div.genes .gGenes p.gene_68 { -webkit-animation-delay: 0.67s;
}
#text div.genes .gGenes p.gene_69 { -webkit-animation-delay: 0.68s;
}
#text div.genes .gGenes p.gene_70 { -webkit-animation-delay: 0.69s;
}
#text div.genes .gGenes p.gene_71 { -webkit-animation-delay: 0.7s;
}
#text div.genes .gGenes p.gene_72 { -webkit-animation-delay: 0.71s;
}
#text div.genes .gGenes p.gene_73 { -webkit-animation-delay: 0.72s;
}
#text div.genes .gGenes p.gene_74 { -webkit-animation-delay: 0.73s;
}
#text div.genes .gGenes p.gene_75 { -webkit-animation-delay: 0.74s;
}
#text div.genes .gGenes p.gene_76 { -webkit-animation-delay: 0.75s;
}
#text div.genes .gGenes p.gene_77 { -webkit-animation-delay: 0.76s;
}
#text div.genes .gGenes p.gene_78 { -webkit-animation-delay: 0.77s;
}
#text div.genes .gGenes p.gene_79 { -webkit-animation-delay: 0.78s;
}
#text div.genes .gGenes p.gene_80 { -webkit-animation-delay: 0.79s;
}
#text div.genes .gGenes p.gene_81 { -webkit-animation-delay: 0.8s;
}
#text div.genes .gGenes p.gene_82 { -webkit-animation-delay: 0.81s;
}
#text div.genes .gGenes p.gene_83 { -webkit-animation-delay: 0.82s;
}
#text div.genes .gGenes p.gene_84 { -webkit-animation-delay: 0.83s;
}
#text div.genes .gGenes p.gene_85 { -webkit-animation-delay: 0.84s;
}
#text div.genes .gGenes p.gene_86 { -webkit-animation-delay: 0.85s;
}
#text div.genes .gGenes p.gene_87 { -webkit-animation-delay: 0.86s;
}
#text div.genes .gGenes p.gene_88 { -webkit-animation-delay: 0.87s;
}
#text div.genes .gGenes p.gene_89 { -webkit-animation-delay: 0.88s;
}
#text div.genes .gGenes p.gene_90 { -webkit-animation-delay: 0.89s;
}
#text div.genes .gGenes p.gene_91 { -webkit-animation-delay: 0.9s;
}
#text div.genes .gGenes p.gene_92 { -webkit-animation-delay: 0.91s;
}
#text div.genes .gGenes p.gene_93 { -webkit-animation-delay: 0.92s;
}
#text div.genes .gGenes p.gene_94 { -webkit-animation-delay: 0.93s;
}
#text div.genes .gGenes p.gene_95 { -webkit-animation-delay: 0.94s;
}
#text div.genes .gGenes p.gene_96 { -webkit-animation-delay: 0.95s;
}
#text div.genes .gGenes p.gene_97 { -webkit-animation-delay: 0.96s;
}
#text div.genes .gGenes p.gene_98 { -webkit-animation-delay: 0.97s;
}
#text div.genes .gGenes p.gene_99 { -webkit-animation-delay: 0.98s;
}
#text div.genes .gGenes p.gene_100 { -webkit-animation-delay: 0.99s;
}
#text div.genes .gGenes p.gene_101 { -webkit-animation-delay: 1s;
}
#text div.genes .gGenes p.gene_102 { -webkit-animation-delay: 1.01s;
}
#text div.genes .gGenes p.gene_103 { -webkit-animation-delay: 1.02s;
}
#text div.genes .gGenes p.gene_104 { -webkit-animation-delay: 1.03s;
}
#text div.genes .gGenes p.gene_105 { -webkit-animation-delay: 1.04s;
}
#text div.genes .gGenes p.gene_106 { -webkit-animation-delay: 1.05s;
}
#text div.genes .gGenes p.gene_107 { -webkit-animation-delay: 1.06s;
}
#text div.genes .gGenes p.gene_108 { -webkit-animation-delay: 1.07s;
}
#text div.genes .gGenes p.gene_109 { -webkit-animation-delay: 1.08s;
}
#text div.genes .gGenes p.gene_110 { -webkit-animation-delay: 1.09s;
}
#text div.genes .gGenes p.gene_111 { -webkit-animation-delay: 1.1s;
}
#text div.genes .gGenes p.gene_112 { -webkit-animation-delay: 1.11s;
}
#text div.genes .gGenes p.gene_113 { -webkit-animation-delay: 1.12s;
}
#text div.genes .gGenes p.gene_114 { -webkit-animation-delay: 1.13s;
}
#text div.genes .gGenes p.gene_115 { -webkit-animation-delay: 1.14s;
}
#text div.genes .gGenes p.gene_116 { -webkit-animation-delay: 1.15s;
}
#text div.genes .gGenes p.gene_117 { -webkit-animation-delay: 1.16s;
}
#text div.genes .gGenes p.gene_118 { -webkit-animation-delay: 1.17s;
}
#text div.genes .gGenes p.gene_119 { -webkit-animation-delay: 1.18s;
}
#text div.genes .gGenes p.gene_120 { -webkit-animation-delay: 1.19s;
}
#text div.genes .gGenes p.gene_121 { -webkit-animation-delay: 1.2s;
}
#text div.genes .gGenes p.gene_122 { -webkit-animation-delay: 1.21s;
}
#text div.genes .gGenes p.gene_123 { -webkit-animation-delay: 1.22s;
}
#text div.genes .gGenes p.gene_124 { -webkit-animation-delay: 1.23s;
}
#text div.genes .gGenes p.gene_125 { -webkit-animation-delay: 1.24s;
}
#text div.genes .gGenes p.gene_126 { -webkit-animation-delay: 1.25s;
}
#text div.genes .gGenes p.gene_127 { -webkit-animation-delay: 1.26s;
}
#text div.genes .gGenes p.gene_128 { -webkit-animation-delay: 1.27s;
}
#text div.genes .gGenes p.gene_129 { -webkit-animation-delay: 1.28s;
}
#text div.genes .gGenes p.gene_130 { -webkit-animation-delay: 1.29s;
}
#text div.genes .gGenes p.gene_131 { -webkit-animation-delay: 1.3s;
}
#text div.genes .gGenes p.gene_132 { -webkit-animation-delay: 1.31s;
}
#text div.genes .gGenes p.gene_133 { -webkit-animation-delay: 1.32s;
}
#text div.genes .gGenes p.gene_134 { -webkit-animation-delay: 1.33s;
}
#text div.genes .gGenes p.gene_135 { -webkit-animation-delay: 1.34s;
}
#text div.genes .gGenes p.gene_136 { -webkit-animation-delay: 1.35s;
}
#text div.genes .gGenes p.gene_137 { -webkit-animation-delay: 1.36s;
}
#text div.genes .gGenes p.gene_138 { -webkit-animation-delay: 1.37s;
}
#text div.genes .gGenes p.gene_139 { -webkit-animation-delay: 1.38s;
}
#text div.genes .gGenes p.gene_140 { -webkit-animation-delay: 1.39s;
}
#text div.genes .gGenes p.gene_141 { -webkit-animation-delay: 1.4s;
}
#text div.genes .gGenes p.gene_142 { -webkit-animation-delay: 1.41s;
}
#text div.genes .gGenes p.gene_143 { -webkit-animation-delay: 1.42s;
}
#text div.genes .gGenes p.gene_144 { -webkit-animation-delay: 1.43s;
}
#text div.genes .gGenes p.gene_145 { -webkit-animation-delay: 1.44s;
}
#text div.genes .gGenes p.gene_146 { -webkit-animation-delay: 1.45s;
}
#text div.genes .gGenes p.gene_147 { -webkit-animation-delay: 1.46s;
}
#text div.genes .gGenes p.gene_148 { -webkit-animation-delay: 1.47s;
}
#text div.genes .gGenes p.gene_149 { -webkit-animation-delay: 1.48s;
}
#text div.genes .gGenes p.gene_150 { -webkit-animation-delay: 1.49s;
}
#text div.genes .gGenes p.gene_151 { -webkit-animation-delay: 1.5s;
}
#text div.genes .gGenes p.gene_152 { -webkit-animation-delay: 1.51s;
}
#text div.genes .gGenes p.gene_153 { -webkit-animation-delay: 1.52s;
}
#text div.genes .gGenes p.gene_154 { -webkit-animation-delay: 1.53s;
}
#text div.genes .gGenes p.gene_155 { -webkit-animation-delay: 1.54s;
}
#text div.genes .gGenes p.gene_156 { -webkit-animation-delay: 1.55s;
}
#text div.genes .gGenes p.gene_157 { -webkit-animation-delay: 1.56s;
}
#text div.genes .gGenes p.gene_158 { -webkit-animation-delay: 1.57s;
}
#text div.genes .gGenes p.gene_159 { -webkit-animation-delay: 1.58s;
}
#text div.genes .gGenes p.gene_160 { -webkit-animation-delay: 1.59s;
}
#text div.genes .gGenes p.gene_161 { -webkit-animation-delay: 1.6s;
}
#text div.genes .gGenes p.gene_162 { -webkit-animation-delay: 1.61s;
}
#text div.genes .gGenes p.gene_163 { -webkit-animation-delay: 1.62s;
}
#text div.genes .gGenes p.gene_164 { -webkit-animation-delay: 1.63s;
}
#text div.genes .gGenes p.gene_165 { -webkit-animation-delay: 1.64s;
}
#text div.genes .gGenes p.gene_166 { -webkit-animation-delay: 1.65s;
}
#text div.genes .gGenes p.gene_167 { -webkit-animation-delay: 1.66s;
}
#text div.genes .gGenes p.gene_168 { -webkit-animation-delay: 1.67s;
}
#text div.genes .gGenes p.gene_169 { -webkit-animation-delay: 1.68s;
}
#text div.genes .gGenes p.gene_170 { -webkit-animation-delay: 1.69s;
}
#text div.genes .gGenes p.gene_171 { -webkit-animation-delay: 1.7s;
}
#text div.genes .gGenes p.gene_172 { -webkit-animation-delay: 1.71s;
}
#text div.genes .gGenes p.gene_173 { -webkit-animation-delay: 1.72s;
}
#text div.genes .gGenes p.gene_174 { -webkit-animation-delay: 1.73s;
}
#text div.genes .gGenes p.gene_175 { -webkit-animation-delay: 1.74s;
}
#text div.genes .gGenes p.gene_176 { -webkit-animation-delay: 1.75s;
}
#text div.genes .gGenes p.gene_177 { -webkit-animation-delay: 1.76s;
}
#text div.genes .gGenes p.gene_178 { -webkit-animation-delay: 1.77s;
}
#text div.genes .gGenes p.gene_179 { -webkit-animation-delay: 1.78s;
}
#text div.genes .gGenes p.gene_180 { -webkit-animation-delay: 1.79s;
}
#text div.genes .gGenes p.gene_181 { -webkit-animation-delay: 1.8s;
}
#text div.genes .gGenes p.gene_182 { -webkit-animation-delay: 1.81s;
}
#text div.genes .gGenes p.gene_183 { -webkit-animation-delay: 1.82s;
}
#text div.genes .gGenes p.gene_184 { -webkit-animation-delay: 1.83s;
}
#text div.genes .gGenes p.gene_185 { -webkit-animation-delay: 1.84s;
}
#text div.genes .gGenes p.gene_186 { -webkit-animation-delay: 1.85s;
}
#text div.genes .gGenes p.gene_187 { -webkit-animation-delay: 1.86s;
}
#text div.genes .gGenes p.gene_188 { -webkit-animation-delay: 1.87s;
}
#text div.genes .gGenes p.gene_189 { -webkit-animation-delay: 1.88s;
}
#text div.genes .gGenes p.gene_190 { -webkit-animation-delay: 1.89s;
}
#text div.genes .gGenes p.gene_191 { -webkit-animation-delay: 1.9s;
}
#text div.genes .gGenes p.gene_192 { -webkit-animation-delay: 1.91s;
}
#text div.genes .gGenes p.gene_193 { -webkit-animation-delay: 1.92s;
}
#text div.genes .gGenes p.gene_194 { -webkit-animation-delay: 1.93s;
}
#text div.genes .gGenes p.gene_195 { -webkit-animation-delay: 1.94s;
}
#text div.genes .gGenes p.gene_196 { -webkit-animation-delay: 1.95s;
}
#text div.genes .gGenes p.gene_197 { -webkit-animation-delay: 1.96s;
}
#text div.genes .gGenes p.gene_198 { -webkit-animation-delay: 1.97s;
}
#text div.genes .gGenes p.gene_199 { -webkit-animation-delay: 1.98s;
}
#text div.genes .gGenes p.gene_200 { -webkit-animation-delay: 1.99s;
}
#text div.genes .gGenes p:hover { background-color: #43434b;
}
#text div[id^="genes_"] { -webkit-transform: translate3d(0, 0, 0); overflow: hidden; -webkit-animation: slidein 0.15s ease-out;
}
#text span { color: #5ec2a5;
}
#text .gene_parent_1 { background-color: rgba(255, 165, 0, 0.4);
}
#text .gene_parent_2 { background-color: rgba(94, 194, 165, 0.4);
}
#text .win { color: #bae5d9;
}
#text .lose { color: #2c745f;
}
.avg_bigtext { text-align: right;
}
.avg_bigtext span { font-size: 24px;
}
.bar_graph { width: 100%; height: 1px; background-color: #173d32; margin-bottom: 1px;
}
.bar_graph span { display: block; height: 1px; background-color: #5ec2a5;
}
.show_time { display: block;
}
.end_time { display: none;
}
@-webkit-keyframes slidein { 0% { -webkit-transform: scale(0.1, 0.1); opacity: 0; } 80% { -webkit-transform: scale(0.12, 500); opacity: 0.1; } 100% { -webkit-transform: scale(1, 1); opacity: 1; }
}
@-webkit-keyframes text_in { 0% { -webkit-transform: scale(0.1, 0.1); opacity: 0; } 80% { -webkit-transform: scale(0.12, 500); opacity: 0.1; } 100% { -webkit-transform: scale(1, 1); opacity: 1; background-color: #dedee2; }
}
@-webkit-keyframes gene_in { 0% { -webkit-transform: scale(0, 0.1); opacity: 0; } 80% { -webkit-transform: scale(0.1, 0.3); opacity: 0.1; } 100% { -webkit-transform: scale(1, 1); opacity: 1; background-color: #f2faf8; }
}
#menu { position: fixed; bottom: 20px; width: 100%; padding-left: 50px; text-align: center; font-size: 24px;
}
#menu_add,
#menu_del { font-size: 24px; display: inline-block; text-align: center; vertical-align: middle; color: #131315; background-color: #3b9d81; height: 34px; margin-left: 5px; -moz-border-radius: 4px / 4px; -webkit-border-radius: 4px 4px; border-radius: 4px / 4px; -moz-box-shadow: 0px 5px #333333; -webkit-box-shadow: 0px 5px #333333; box-shadow: 0px 5px #333333; padding: 0 30px; line-height: 1.45em; -moz-user-select: -moz-none; -ms-user-select: none; -webkit-user-select: none; user-select: none;
}
#menu_add:hover,
#menu_del:hover { cursor: pointer; background-color: #74cab1; z-index: 100;
}
#menu_add:not(:active),
#menu_del:not(:active) { transition: background-color 150ms ease-in;
}
#menu_add:active,
#menu_del:active { background: #fff; -moz-transform: scale(1.01, 1.01); -ms-transform: scale(1.01, 1.01); -webkit-transform: scale(1.01, 1.01); transform: scale(1.01, 1.01);
}
body { background-attachment: fixed; background-color: #080808; background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHhtbG5zOnhsaW5rPSdodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rJyB3aWR0aD0nMzAwJyBoZWlnaHQ9JzE1MCcgdmlld0JveD0nMCAwIDYwIDMwJz4KCTxkZWZzPgoJCTxwYXRoIGlkPSdzJyBmaWxsPScjZmZmZmZmJyBkPSdNMCwwbDUgMi41bC01LDIuNXonLz4KCTwvZGVmcz4KCTxnIGlkPSdiJz4KCTx1c2UgeD0nLTUnIHk9Jy0yLjUnIHRyYW5zZm9ybT0nbWF0cml4KC0xIDAgMCAxIDAgMCknIGZpbGwtb3BhY2l0eT0nMC4wMzQnIHhsaW5rOmhyZWY9JyNzJyAvPgoJPHVzZSB4PScwJyB5PScwJyBmaWxsLW9wYWNpdHk9JzAuMDUxJyB4bGluazpocmVmPScjcycgLz4KCTx1c2UgeD0nLTUnIHk9JzIuNScgdHJhbnNmb3JtPSdtYXRyaXgoLTEgMCAwIDEgMCAwKScgZmlsbC1vcGFjaXR5PScwLjA1MScgeGxpbms6aHJlZj0nI3MnIC8+Cgk8dXNlIHg9JzAnIHk9JzUnIGZpbGwtb3BhY2l0eT0nMC4wNTEnIHhsaW5rOmhyZWY9JyNzJyAvPgoJPHVzZSB4PSctNScgeT0nNy41JyB0cmFuc2Zvcm09J21hdHJpeCgtMSAwIDAgMSAwIDApJyBmaWxsLW9wYWNpdHk9JzAuMDY4JyB4bGluazpocmVmPScjcycgLz4KCTx1c2UgeD0nMCcgeT0nMTAnIGZpbGwtb3BhY2l0eT0nMC4wMzQnIHhsaW5rOmhyZWY9JyNzJyAvPgoJPHVzZSB4PSctNScgeT0nMTIuNScgdHJhbnNmb3JtPSdtYXRyaXgoLTEgMCAwIDEgMCAwKScgZmlsbC1vcGFjaXR5PScwLjAzNCcgeGxpbms6aHJlZj0nI3MnIC8+Cgk8dXNlIHg9JzUnIHk9Jy0yLjUnIGZpbGwtb3BhY2l0eT0nMC4wNTEnIHhsaW5rOmhyZWY9JyNzJyAvPgoJPHVzZSB4PSctMTAnIHk9JzAnIHRyYW5zZm9ybT0nbWF0cml4KC0xIDAgMCAxIDAgMCknIGZpbGwtb3BhY2l0eT0nMC4wNjgnIHhsaW5rOmhyZWY9JyNzJyAvPgoJPHVzZSB4PSc1JyB5PScyLjUnIGZpbGwtb3BhY2l0eT0nMC4wNTEnIHhsaW5rOmhyZWY9JyNzJyAvPgoJPHVzZSB4PSctMTAnIHk9JzUnIHRyYW5zZm9ybT0nbWF0cml4KC0xIDAgMCAxIDAgMCknIGZpbGwtb3BhY2l0eT0nMC4wMzQnIHhsaW5rOmhyZWY9JyNzJyAvPgoJPHVzZSB4PSc1JyB5PSc3LjUnIGZpbGwtb3BhY2l0eT0nMC4wMTcnIHhsaW5rOmhyZWY9JyNzJyAvPgoJPHVzZSB4PSctMTAnIHk9JzEwJyB0cmFuc2Zvcm09J21hdHJpeCgtMSAwIDAgMSAwIDApJyBmaWxsLW9wYWNpdHk9JzAuMDM0JyB4bGluazpocmVmPScjcycgLz4KCTx1c2UgeD0nNScgeT0nMTIuNScgZmlsbC1vcGFjaXR5PScwLjA1MScgeGxpbms6aHJlZj0nI3MnIC8+Cgk8dXNlIHg9Jy0xNScgeT0nLTIuNScgdHJhbnNmb3JtPSdtYXRyaXgoLTEgMCAwIDEgMCAwKScgZmlsbC1vcGFjaXR5PScwLjAzNCcgeGxpbms6aHJlZj0nI3MnIC8+Cgk8dXNlIHg9JzEwJyB5PScwJyBmaWxsLW9wYWNpdHk9JzAuMDM0JyB4bGluazpocmVmPScjcycgLz4KCTx1c2UgeD0nLTE1JyB5PScyLjUnIHRyYW5zZm9ybT0nbWF0cml4KC0xIDAgMCAxIDAgMCknIGZpbGwtb3BhY2l0eT0nMC4wNTEnIHhsaW5rOmhyZWY9JyNzJyAvPgoJPHVzZSB4PScxMCcgeT0nNScgZmlsbC1vcGFjaXR5PScwLjAzNCcgeGxpbms6aHJlZj0nI3MnIC8+Cgk8dXNlIHg9Jy0xNScgeT0nNy41JyB0cmFuc2Zvcm09J21hdHJpeCgtMSAwIDAgMSAwIDApJyBmaWxsLW9wYWNpdHk9JzAuMDE3JyB4bGluazpocmVmPScjcycgLz4JCgk8dXNlIHg9JzEwJyB5PScxMCcgZmlsbC1vcGFjaXR5PScwLjAzNCcgeGxpbms6aHJlZj0nI3MnIC8+Cgk8dXNlIHg9Jy0xNScgeT0nMTIuNScgdHJhbnNmb3JtPSdtYXRyaXgoLTEgMCAwIDEgMCAwKScgZmlsbC1vcGFjaXR5PScwLjAzNCcgeGxpbms6aHJlZj0nI3MnIC8+Cgk8dXNlIHg9JzE1JyB5PSctMi41JyBmaWxsLW9wYWNpdHk9JzAuMDM0JyB4bGluazpocmVmPScjcycgLz4KCTx1c2UgeD0nLTIwJyB5PScwJyB0cmFuc2Zvcm09J21hdHJpeCgtMSAwIDAgMSAwIDApJyBmaWxsLW9wYWNpdHk9JzAuMDM0JyB4bGluazpocmVmPScjcycgLz4KCTx1c2UgeD0nMTUnIHk9JzIuNScgZmlsbC1vcGFjaXR5PScwLjAxNycgeGxpbms6aHJlZj0nI3MnIC8+Cgk8dXNlIHg9Jy0yMCcgeT0nNScgdHJhbnNmb3JtPSdtYXRyaXgoLTEgMCAwIDEgMCAwKScgZmlsbC1vcGFjaXR5PScwLjA1MScgeGxpbms6aHJlZj0nI3MnIC8+Cgk8dXNlIHg9JzE1JyB5PSc3LjUnIGZpbGwtb3BhY2l0eT0nMC4wNTEnIHhsaW5rOmhyZWY9JyNzJyAvPgoJPHVzZSB4PSctMjAnIHk9JzEwJyB0cmFuc2Zvcm09J21hdHJpeCgtMSAwIDAgMSAwIDApJyBmaWxsLW9wYWNpdHk9JzAuMDE3JyB4bGluazpocmVmPScjcycgLz4KCTx1c2UgeD0nMTUnIHk9JzEyLjUnIGZpbGwtb3BhY2l0eT0nMC4wMzQnIHhsaW5rOmhyZWY9JyNzJyAvPgoJPHVzZSB4PSctMjUnIHk9Jy0yLjUnIHRyYW5zZm9ybT0nbWF0cml4KC0xIDAgMCAxIDAgMCknIGZpbGwtb3BhY2l0eT0nMC4wNTEnIHhsaW5rOmhyZWY9JyNzJyAvPgkKCTx1c2UgeD0nMjAnIHk9JzAnIGZpbGwtb3BhY2l0eT0nMC4wNjgnIHhsaW5rOmhyZWY9JyNzJyAvPgoJPHVzZSB4PSctMjUnIHk9JzIuNScgdHJhbnNmb3JtPSdtYXRyaXgoLTEgMCAwIDEgMCAwKScgZmlsbC1vcGFjaXR5PScwLjAxNycgeGxpbms6aHJlZj0nI3MnIC8+Cgk8dXNlIHg9JzIwJyB5PSc1JyBmaWxsLW9wYWNpdHk9JzAuMDM0JyB4bGluazpocmVmPScjcycgLz4KCTx1c2UgeD0nLTI1JyB5PSc3LjUnIHRyYW5zZm9ybT0nbWF0cml4KC0xIDAgMCAxIDAgMCknIGZpbGwtb3BhY2l0eT0nMC4wNTEnIHhsaW5rOmhyZWY9JyNzJyAvPgoJPHVzZSB4PScyMCcgeT0nMTAnIGZpbGwtb3BhY2l0eT0nMC4wMTcnIHhsaW5rOmhyZWY9JyNzJyAvPgoJPHVzZSB4PSctMjUnIHk9JzEyLjUnIHRyYW5zZm9ybT0nbWF0cml4KC0xIDAgMCAxIDAgMCknIGZpbGwtb3BhY2l0eT0nMC4wNTEnIHhsaW5rOmhyZWY9JyNzJyAvPgoJPHVzZSB4PScyNScgeT0nLTIuNScgZmlsbC1vcGFjaXR5PScwLjAzNCcgeGxpbms6aHJlZj0nI3MnIC8+Cgk8dXNlIHg9Jy0zMCcgeT0nMCcgdHJhbnNmb3JtPSdtYXRyaXgoLTEgMCAwIDEgMCAwKScgZmlsbC1vcGFjaXR5PScwLjAzNCcgeGxpbms6aHJlZj0nI3MnIC8+CQoJPHVzZSB4PScyNScgeT0nMi41JyBmaWxsLW9wYWNpdHk9JzAuMDY4JyB4bGluazpocmVmPScjcycgLz4KCTx1c2UgeD0nLTMwJyB5PSc1JyB0cmFuc2Zvcm09J21hdHJpeCgtMSAwIDAgMSAwIDApJyBmaWxsLW9wYWNpdHk9JzAuMDM0JyB4bGluazpocmVmPScjcycgLz4JCgk8dXNlIHg9JzI1JyB5PSc3LjUnIGZpbGwtb3BhY2l0eT0nMC4wNTEnIHhsaW5rOmhyZWY9JyNzJyAvPgoJPHVzZSB4PSctMzAnIHk9JzEwJyB0cmFuc2Zvcm09J21hdHJpeCgtMSAwIDAgMSAwIDApJyBmaWxsLW9wYWNpdHk9JzAuMDM0JyB4bGluazpocmVmPScjcycgLz4KCTx1c2UgeD0nMjUnIHk9JzEyLjUnIGZpbGwtb3BhY2l0eT0nMC4wMzQnIHhsaW5rOmhyZWY9JyNzJyAvPgoJPC9nPgoJPHVzZSB4PSctMzAnIHk9JzE1JyB0cmFuc2Zvcm09J21hdHJpeCgtMSAwIDAgMSAwIDApJyB4bGluazpocmVmPScjYicgLz4KCTx1c2UgeD0nLTYwJyB5PSctMTAnIHRyYW5zZm9ybT0nbWF0cml4KC0xIDAgMCAtMSAwIDApJyB4bGluazpocmVmPScjYicgLz4KCTx1c2UgeD0nMzAnIHk9Jy0yMCcgdHJhbnNmb3JtPSdtYXRyaXgoMSAwIDAgLTEgMCAwKScgeGxpbms6aHJlZj0nI2InIC8+Cgk8dXNlIHg9JzMwJyB5PSctMzUnIHRyYW5zZm9ybT0nbWF0cml4KDEgMCAwIC0xIDAgMCknIHhsaW5rOmhyZWY9JyNiJyAvPgo8L3N2Zz4K");
}

Simple genetic algorithm - Script Codes JS Codes

$(function(){ /* ::propaty */ var DISP_DURATION = 80; var DISP_SCROLL_DURATION = 250; var FIRST_GENERATIONS_NUM = 2; var PROGENY_NUM = 20; var PROGENY_NUM_MAX = 50; var PROGENY_CROSS_NUM = 2; var GINE_NUM = 8; var GINE_NUM_MAX = 20; var _generations = []; var _generationCount = 1; var _geneCount = 1; var _scoreLength = 3; var _scoreDispFlg = true; var _scoreDispAddClassName = "show_time"; var _scoreDispRemoveClassName = "end_time"; var _ele, _avgEle, _maxScore; /* ::dat.gui setting */ var Setting = function(){ this.progeny_num = PROGENY_NUM; this.progeny_num_max = PROGENY_NUM_MAX; this.gine_num = GINE_NUM; this.gine_num_max = GINE_NUM_MAX; this.displayScore = _scoreDispFlg; } var setting = new Setting(); var gui = new dat.GUI(); gui.add(setting, 'progeny_num', 5, setting.progeny_num_max, 1).onFinishChange(function(value){ PROGENY_NUM = Math.floor(value); init(); }); gui.add(setting, 'gine_num', 5, setting.gine_num_max, 1).onFinishChange(function(value){ GINE_NUM = Math.floor(value); init(); }); gui.add(setting, "displayScore").onFinishChange(function(value){ _scoreDispFlg = value; if(_scoreDispFlg){ _scoreDispAddClassName = "show_time"; _scoreDispRemoveClassName = "end_time"; }else{ _scoreDispAddClassName = "end_time"; _scoreDispRemoveClassName = "show_time"; } $(".gene_disp_flg").removeClass(_scoreDispRemoveClassName); $(".gene_disp_flg").addClass(_scoreDispAddClassName); });
// gui.remember(setting); /* ::html template method */ // generation html template var _generationTemplate = $("#generation_template").text(); var _createGeneration = _.template(_generationTemplate); function getGenerationHtml(id) { return _createGeneration({"id": id, "ordinalID":getOrdinal(id)}); } // progeny html template var _progenyTemplate = $("#progeny_template").text(); var _createProgeny = _.template(_progenyTemplate); function getProgenyHtml(id, geneText, score) { return _createProgeny({ "id": id, "idFill": zeroFill(id), "geneText": geneText, "scoreFill": zeroFillScore(score), "percent":score / _maxScore * 100 }); } // avg html template var _avgTemplate = $("#avg_template").text(); var _createAvg = _.template(_avgTemplate); function getAvgHtml(id, avg) { return _createAvg({ "id": id, "idFill": zeroFill(id), "avgFixed": avg.toFixed(1), "percent":avg / _maxScore * 100 }); } /* ::main method */ /* :世代 */ function generation(lastGeneration, scrollFlg){ this.id = _generationCount++; this.progenys = []; this.winProgenys = []; this.loseProgenys = []; this.avg = 0; this.myEle = ""; this.setMyElement(); this.showGeneration(lastGeneration); var progenys = []; if(lastGeneration == null){ // first generation for(var i = 0; i < PROGENY_NUM; i++){ var pro = new progeny(this.id); pro.resetGene(); progenys.push(pro); } }else{ for(var i = 0; i < PROGENY_CROSS_NUM; i++){ var pro = new progeny(this.id); pro.crossGene(lastGeneration.winProgenys); progenys.push(pro); } for(var i = 0; i < PROGENY_NUM - PROGENY_CROSS_NUM; i++){ var pro = lastGeneration.progenys[i]; progenys.push(pro); } } this.progenys = progenys; this.setAVG(); this.setWinLose(); this.showProgenys(); this.showProgenysDetail(); this.showColor(); if(scrollFlg){ var targetOffset = this.myEle.offset().top; $('html,body').delay(DISP_SCROLL_DURATION).animate({scrollTop: targetOffset}, DISP_SCROLL_DURATION); } } generation.prototype.showProgenys = function(){ for(var i = 0; i < this.progenys.length; i++){ var progeny = this.progenys[i]; this.myEle.find(".gGenes").append(progeny.getGeneHtml(this.id)); } } generation.prototype.showProgenysDetail = function(){ $(".gene_disp_flg").removeClass(_scoreDispRemoveClassName); $(".gene_disp_flg").addClass(_scoreDispAddClassName); } generation.prototype.setMyElement = function(){ _ele.append(getGenerationHtml(this.id)); this.myEle = _ele.find("div#genes_"+ this.id); } generation.prototype.showGeneration = function(lastGeneration){ var parentEle = this.myEle.find(".gParent"); var lastWinner; if(lastGeneration != null){ lastWinner = lastGeneration.winProgenys; } if(lastWinner != null){ parentEle.append(lastWinner[0].getGeneHtml(this.id)); parentEle.append(lastWinner[1].getGeneHtml(this.id)); parentEle.find("p.gene_"+ lastWinner[0].id +" strong").addClass("gene_parent_1"); parentEle.find("p.gene_"+ lastWinner[1].id +" strong").addClass("gene_parent_2"); }else{ parentEle.append("<p>-- nothing</p>"); parentEle.append("<p>-- nothing</p>"); } } generation.prototype.setWinLose = function(){ // score降順にソート this.progenys.sort( function ( progeny1, progeny2 ) { return progeny2["score"] - progeny1["score"]; }); var winner1st = this.progenys[0]; var winner2nd = this.progenys[1]; if(winner1st.score == winner2nd.score){ var lowNums = []; for(var i = 0; i < PROGENY_NUM; i++){ if(this.progenys[i].score < winner2nd.score){ lowNums.push(this.progenys[i]); } } if(lowNums != []){ lowNums.sort(function(a,b){ return(b.score - a.score); }); winner2nd = lowNums[0]; } } this.winProgenys = [winner1st, winner2nd]; this.loseProgenys = [this.progenys[PROGENY_NUM - 1], this.progenys[PROGENY_NUM -2]]; } generation.prototype.setAVG = function(){ var avg = 0; for(var i = 0; i < PROGENY_NUM; i++){ avg += this.progenys[i].score; } avg /= PROGENY_NUM; this.avg = avg; // show this.myEle.find("span#avg_"+ this.id).append(this.avg.toFixed(1)); _avgEle.append(getAvgHtml(this.id, this.avg)); } generation.prototype.showColor = function(){ this.myEle.find("p.gene_"+ this.winProgenys[0].id).addClass("win"); this.myEle.find("p.gene_"+ this.winProgenys[1].id).addClass("win"); this.myEle.find("p.gene_"+ this.loseProgenys[0].id).addClass("lose"); this.myEle.find("p.gene_"+ this.loseProgenys[1].id).addClass("lose"); } /* :遺伝 */ function progeny(generationID){ this.id = _geneCount++; this.birthGenerationID = generationID; this.gene = []; this.parentGene; this.parent; // [parent1.id, parent2.id] this.score = 0; } progeny.prototype.resetGene = function(){ var gene = []; for(var i = 0; i < GINE_NUM; i++){ gene.push(parseInt(Math.random() * 2)); } this.gene = gene; this.setScore(); } progeny.prototype.crossGene = function(parent){ var gene = []; var pGene = []; this.parent = parent; for(var i = 0; i < GINE_NUM; i++){ var crossFlg = parseInt(Math.random() * PROGENY_CROSS_NUM); gene.push(parseInt(parent[crossFlg].gene[i])); pGene.push(parseInt(parent[crossFlg].id)); } this.gene = gene; this.parentGene = pGene; this.setScore(); } progeny.prototype.setScore = function(){ var score = 0; for(var i = 0; i < GINE_NUM; i++){ if(this.gene[GINE_NUM-i]!=0){ score += Math.pow(2, i); } } this.score = score; } progeny.prototype.getGeneHtml = function(buildGenerationID){ var geneText = this.gene; if(buildGenerationID == this.birthGenerationID && this.parent != null){ geneText = ""; for(i = 0; i < this.gene.length; i++){ if(this.parentGene[i] == this.parent[0].id){ geneText += "<span class='gene_parent_1'>" + this.gene[i] + "</span>"; }else{ geneText += "<span class='gene_parent_2'>" + this.gene[i] + "</span>"; } if(i != this.gene.length - 1){ geneText += ","; } } } return getProgenyHtml(this.id, geneText, this.score); } /* ::sub method */ var zeroFill = function(n){ return ("00" + n).slice(-3) } var zeroFillScore = function(n){ var zeros = "00"; for(var i = 3;i<_scoreLength;i++){ zeros += "" + "0"; } return (zeros + "" + n).slice(-1*_scoreLength) } var getOrdinal = function(n) { var s=["th","st","nd","rd"], v=n%100; return n+(s[(v-20)%10]||s[v]||s[0]); } var getBinaryToDecimalFigure = function(bineryFigure){ // https://codepen.io/uriuriuriu/pen/vyfmj return Math.floor(bineryFigure * Math.LOG10E * Math.log(2)) + 1; } // button $("#menu_add").click(function(){ _generations.push(new generation(_.last(_generations),true)); }); $("#menu_del").click(function(){ init(); }); /* ::init method */ var init = function(){ // clear _ele = $('#text'); _avgEle = $('#avgs'); _ele.html(""); _avgEle.html("<h3>AVGs</h3>"); _generationCount = 1; _geneCount = 1; _generations = []; _scoreLength = getBinaryToDecimalFigure(GINE_NUM); _scoreLength = ( _scoreLength < 3 ) ? 3 : _scoreLength; _maxScore = Math.pow(2,GINE_NUM) - 1; _generations.push(new generation()); for(var i = 0; i<FIRST_GENERATIONS_NUM - 1; i++){ window.setTimeout(function(){ _generations.push(new generation(_.last(_generations))); }, DISP_DURATION * i); } }; init();
});

Home Page	Home
Developer	Uriuriuriu
Username	uriuriuriu
Uploaded	January 10, 2023
Rating	3.5
Size	10,179 Kb
Views	2,024

Do you need developer help for Simple genetic algorithm?

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!

Uriuriuriu (uriuriuriu) Script Codes

Name	Size
Now	4,505 Kb
SANGETUKI separator	11,128 Kb
Canvas Gaussian Blur	3,439 Kb
AngularJS - first step -	3,009 Kb
Css action sideBar	3,928 Kb
Canvas circle gauge	3,773 Kb
Enchant.js sample	3,131 Kb
Glitch test	4,246 Kb
Css background animation	2,854 Kb
Glitch Video	3,178 Kb

Create amazing love letters 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!

Similar Scripts & Codes

Name	Username	Size
Particle Motion trajectories	Sniejadlik	5,899 Kb
Out of the blue	Giaco	2,537 Kb
Search Box in Content Moves to Fixed Header	Chriscoyier	2,768 Kb
Buttons for autumn	Nikazawila	1,795 Kb
Website Concept	Sagoza	3,104 Kb
Popup Modal	Aldlevine	3,696 Kb
My Interests	Anshusaxenaarora	2,015 Kb
Toggling Divs with jQuery	Yying6	1,967 Kb
CSS eye follow	Pedrocampos	2,592 Kb
Canvas stripes	Adrianparr	1,948 Kb

Do you want hide your ip address?

Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup. Hide Your IP Now!