Sticking together

by bramvandijk88

HTML

<!-- 
  ###########################################################################################
    This is a JSFiddle example of "Cacatoo". This HTML page does not contain the code itself,
    but determines where the grids, graphs, buttons, etc are placed. The real code is in the 
    Javascript Tab. I recommend enabling "Tabs (Columns)" under the settings in the top-right. 
  ###########################################################################################
-->

<html>
  <script src="https://bramvandijk88.github.io/cacatoo/scripts/cacatoo.js"></script>
<script src="https://bramvandijk88.github.io/cacatoo/scripts/all.js"></script>  
<link rel="stylesheet" href="https://bramvandijk88.github.io/cacatoo/styles/cacatoo.css">

  <head>
    <title>Cacatoo examples</title>
  </head>



  <body onload="cacatoo()">
    

		<div class="", id="all_holder">		
        
          
			<div class="content" id="canvas_holder"> </div>
			<div class="content" id="graph_holder"> </div>
		<div class="content" id="form_holder"></div>
    
		<div class="output" id="output"></div>
		</div>



    
  </body>

</html>

JavaScript

/*-----------------------Start user-defined code ---------------------*/

let sim;



var birth = 0.1
var num_startboids = 500
var mycohesion = 0.03
var mycollision = 0.5
var resource_width = 70
var resource_noise = 3
var nr_peaks = 2
var time_between = 5000
var speed = 100
var disperse = false
var mutation_rate = 0.1


function cacatoo() {
  
  let simconfig = {
    title: "Collective migration", // The name of your cacatoo-simulation
    description: "", // And a description if you wish
    maxtime: 1000000, // How many time steps the model continues to run
    // (note, the onscreen FPS may drop below 60 fps when using fast mode, although many more timesteps may be handled per second)
    ncol: 250, // Number of columns (width of your grid)
    nrow: 250, // Number of rows (height of your grid)
    scale: 2, // Scale of the grid (nxn pixels per grid point)
    sleep: 0,
		seed: 2,
    wrap: [true,true],
    graph_update: 50,
    graph_interval: 50,
    fpsmeter: true
  }

  // FLOCKCONFIG EXAMPLE
  // This example sets up a boid simulation with specific values for the currently implemented parameters
  // Note however, all these parameters have defaults, so not all need to be set by the user. 
  let flockconfig = {
    // Flock parameters
    num_boids: 0,            // Starting number of boids (flocking individuals)
    shape: 'dot',            // Shape of the boids drawn (options: bird, arrow, line, rect, dot, ant)
    click: 'repel',          // Clicking the boids pushes them away from the mouse
    max_speed: 1.0,          // Maximum velocity of boids
    max_force: 1.0,          // Maximum steering force applied to boids (separation/cohesion/alignment rules)
    init_velocity:0,
    friction: 0.1,           // Them ants are darn slippery :)
    brownian: 0.05,
    // Mouse parameters
    mouse_radius: 20,        // Radius of boids captured by the mouse overlay
    draw_mouse_radius: 'true',    // Show a circle where the mouse is
    draw_mouse_colour:...