agentscript
Version:
AgentScript Model in Model/View architecture
64 lines (45 loc) • 2.07 kB
HTML
<html>
<head>
<title>CountyWalker</title>
</head>
<body>
<div id="map"></div>
<script type="module">
import * as gis from '../src/gis.js'
import * as mltools from './mltools.js'
import Model from '../models/CountiesModel.js'
import MapDraw from '../src/MapDraw.js'
import RunModelView from '../src/RunModelView.js'
const viewOptions = {
// div: util.createCanvas(0, 0), // default & the view will resize
drawOptions: {
// patchesColor: 'transparent', // default in MapDraw
linksColor: 'gray',
linksWidth: 4,
turtlesSize: 6,
turtlesColor: t => modelView.view.drawOptions.turtlesMap.atIndex(t.county + 1),
},
}
const modelView = new RunModelView(Model, MapDraw, viewOptions)
await modelView.setWorld() // use CountiesModel's default
// ===== Start of map & layers
const world = modelView.world // use the model's world object below
const counties = world.geojson
const countiesBBox = world.bbox
const terrain = gis.template('osm')
const elevation = gis.elevationTemplate('mapzen')
const map = await mltools.newMap(world.bboxCenter(), 5)
// map.onLoad(...) // not needed, await above includes onload
mltools.addRasterLayer(map, 'osm', terrain)
mltools.addRasterLayer(map, 'elevation', elevation, 0.15)
mltools.addGeojsonLayer(map, 'counties', counties, 'rgba(255, 0, 0, 0.2)', 'red', 3)
mltools.addGeojsonLineLayer(map, 'countiesBBox', countiesBBox, 'blue')
mltools.addCanvasLayer(map, 'model', modelView.canvas, world.bboxCoords())
const msg = props => props.NAME + ', pop: ' + props.population.toLocaleString()
mltools.addLayerClickPopup(map, 'counties', msg, 'bottom-right')
// ===== End of map & layers
modelView.run(-1, 30) // steps, fps. steps of -1 goes forever
</script>
</body>
</html>