cacatoo
Version:
Building, exploring, and sharing spatially structured models
671 lines (137 loc) • 8.78 kB
HTML
<html lang="en">
<head>
<meta charset="utf-8">
<title>JSDoc: Class: Canvas</title>
<script src="scripts/prettify/prettify.js"> </script>
<script src="scripts/prettify/lang-css.js"> </script>
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
<link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
</head>
<body>
<div id="main">
<h1 class="page-title">Class: Canvas</h1>
<section>
<header>
<h2><span class="attribs"><span class="type-signature"></span></span>Canvas<span class="signature">(model, property, height, width, scale)</span><span class="type-signature"></span></h2>
<div class="class-description">Canvas is a wrapper-class for a HTML-canvas element. It is linked to a @Gridmodel object, and stores what from that @Gridmodel should be displayed (width, height, property, scale, etc.)</div>
</header>
<article>
<div class="container-overview">
<h2>Constructor</h2>
<h4 class="name" id="Canvas"><span class="type-signature"></span>new Canvas<span class="signature">(model, property, height, width, scale)</span><span class="type-signature"></span></h4>
<div class="description">
The constructor function for a @Canvas object.
</div>
<h5>Parameters:</h5>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>model</code></td>
<td class="type">
<span class="param-type">model</span>
</td>
<td class="description last">The model ( @Gridmodel or @Flockmodel ) to which this canvas belongs</td>
</tr>
<tr>
<td class="name"><code>property</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="description last">the property that should be shown on the canvas</td>
</tr>
<tr>
<td class="name"><code>height</code></td>
<td class="type">
<span class="param-type">int</span>
</td>
<td class="description last">height of the canvas (in rows)</td>
</tr>
<tr>
<td class="name"><code>width</code></td>
<td class="type">
<span class="param-type">int</span>
</td>
<td class="description last">width of the canvas (in cols)</td>
</tr>
<tr>
<td class="name"><code>scale</code></td>
<td class="type">
<span class="param-type">scale</span>
</td>
<td class="description last">of the canvas (width/height of each gridpoint in pixels)</td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="cacatoo.js.html">cacatoo.js</a>, <a href="cacatoo.js.html#line2500">line 2500</a>
</li></ul></dd>
</dl>
</div>
<h3 class="subsection-title">Methods</h3>
<h4 class="name" id="displayflock"><span class="type-signature"></span>displayflock<span class="signature">()</span><span class="type-signature"></span></h4>
<div class="description">
Draw the state of the flockmodel onto the HTML element
</div>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="cacatoo.js.html">cacatoo.js</a>, <a href="cacatoo.js.html#line2712">line 2712</a>
</li></ul></dd>
</dl>
<h4 class="name" id="displaygrid"><span class="type-signature"></span>displaygrid<span class="signature">()</span><span class="type-signature"></span></h4>
<div class="description">
Draw the state of the model (for a specific property) onto the HTML element
</div>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="cacatoo.js.html">cacatoo.js</a>, <a href="cacatoo.js.html#line2555">line 2555</a>
</li></ul></dd>
</dl>
<h4 class="name" id="displaygrid_dots"><span class="type-signature"></span>displaygrid_dots<span class="signature">()</span><span class="type-signature"></span></h4>
<div class="description">
Draw the state of the model (for a specific property) onto the HTML element
</div>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="cacatoo.js.html">cacatoo.js</a>, <a href="cacatoo.js.html#line2633">line 2633</a>
</li></ul></dd>
</dl>
<h4 class="name" id="drawBoid"><span class="type-signature"></span>drawBoid<span class="signature">()</span><span class="type-signature"></span></h4>
<div class="description">
This function is empty by default, and is overriden based on parameters chose by the model.
Override options are all below this option. Options are:
Point: a circle
Rect: a square
Arrow: an arrow that rotates in the direction the boid is moving
Bird: an arrow, but very wide so it looks like a bird
Line: a line that has the direction AND length of the velocity vector
Ant: three dots form an ant body with two lines forming antanae
Png: an image. PNG is sourced from boid.png
</div>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="cacatoo.js.html">cacatoo.js</a>, <a href="cacatoo.js.html#line2793">line 2793</a>
</li></ul></dd>
</dl>
</article>
</section>
</div>
<nav>
<h2><a href="index.html">Home</a></h2><h3>Classes</h3><ul><li><a href="Canvas.html">Canvas</a></li><li><a href="Flockmodel.html">Flockmodel</a></li><li><a href="Graph.html">Graph</a></li><li><a href="Gridmodel.html">Gridmodel</a></li><li><a href="Gridpoint.html">Gridpoint</a></li><li><a href="ODE.html">ODE</a></li><li><a href="QuadTree.html">QuadTree</a></li><li><a href="Simulation.html">Simulation</a></li></ul><h3>Global</h3><ul><li><a href="global.html#CopyGridODEs">CopyGridODEs</a></li><li><a href="global.html#MakeGrid">MakeGrid</a></li><li><a href="global.html#copy">copy</a></li><li><a href="global.html#default_colours">default_colours</a></li><li><a href="global.html#dict_reverse">dict_reverse</a></li><li><a href="global.html#get2DFromCanvas">get2DFromCanvas</a></li><li><a href="global.html#hexToRGB">hexToRGB</a></li><li><a href="global.html#nameToRGB">nameToRGB</a></li><li><a href="global.html#parseColours">parseColours</a></li><li><a href="global.html#pause">pause</a></li><li><a href="global.html#random_colours">random_colours</a></li><li><a href="global.html#shuffle">shuffle</a></li><li><a href="global.html#stringToRGB">stringToRGB</a></li></ul>
</nav>
<br class="clear">
<footer>
Documentation generated by <a href="https://github.com/jsdoc/jsdoc">JSDoc 4.0.2</a> on Wed Dec 18 2024 17:10:07 GMT+0100 (Central European Standard Time)
</footer>
<script> prettyPrint(); </script>
<script src="scripts/linenumber.js"> </script>
</body>
</html>