agentscript
Version:
AgentScript Model in Model/View architecture
66 lines (49 loc) • 1.72 kB
HTML
<html>
<head>
<title>DropletsStatic</title>
</head>
<body>
<div id="map"></div>
<script type="module">
import * as mltools from './mltools.js'
import Model from '../models/DropletsModel.js'
import TwoDraw from '../src/TwoDraw.js'
import Animator from '../src/Animator.js'
const bbox = mltools.santaFeBBox
const patchesWidth = 250
const zoom = 10
const model = new Model({ bbox, patchesWidth }) // bbox => GeoWorld.js
await model.startup(zoom) // DropletsModel needs startup
model.setup()
const view = new TwoDraw(model, {
div: mltools.newCanvas(),
patchSize: 10,
drawOptions: {
patchesColor: 'transparent',
turtlesShape: 'square',
turtlesRotate: false,
turtlesSize: 1.5,
turtlesColor: 'blue',
},
})
// ===== Start of map & layers
// terrain sources: osm topo topo1 smooth usgs
// elevation sources: mapzen maptiler redfishUSA redfishWorld mapbox
const terrain = mltools.terrain('usgs')
const elevation = mltools.elevation('mapzen')
const map = await mltools.newMap(bbox, zoom)
mltools.addRasterLayer(map, 'terrain', terrain)
mltools.addGeojsonLayer(map, 'bbox', bbox, 'transparent', 'red', 3)
mltools.addCanvasLayer(map, 'model', view.canvas, bbox)
// ===== End of map & layers
new Animator(
() => {
model.step()
view.draw()
},
-1, // run forever
10 // fps
)
</script>
</body>
</html>