@swim/map provides canvas views for efficiently rendering geospatially located map overlays, including fully animatable views for lines, circles, and polygons. Check out the traffic map and transit map demos to see massively real-time maps in action. @swim/map is part of the @swim/ux framework.
For an npm-managed project,
npm install @swim/map to make it a dependency.
TypeScript sources will be installed into
node_modules/@swim/map/lib/main. And a pre-built UMD script can
be found in
Browser applications can load
swim-ux.js—which bundles the @swim/map
library—along with its
swim-ui.js dependencies, directly
from the swimOS CDN.
<!-- Development --> <script src="https://cdn.swimos.org/js/latest/swim-core.js"></script> <script src="https://cdn.swimos.org/js/latest/swim-ui.js"></script> <script src="https://cdn.swimos.org/js/latest/swim-ux.js"></script> <!-- Production --> <script src="https://cdn.swimos.org/js/latest/swim-core.min.js"></script> <script src="https://cdn.swimos.org/js/latest/swim-ui.min.js"></script> <script src="https://cdn.swimos.org/js/latest/swim-ux.min.js"></script>
Alternatively, the standalone
swim-system.js script may be loaded
from the swimOS CDN, which bundles @swim/map together with all other
<!-- Development --> <script src="https://cdn.swimos.org/js/latest/swim-system.js"></script> <!-- Production --> <script src="https://cdn.swimos.org/js/latest/swim-system.min.js"></script>
@swim/map can be imported as an ES6 module from TypeScript and other ES6-compatible environments.
import * as map from "@swim/map";
@swim/map can also be used as a CommonJS module in Node.js applications.
var map = require("@swim/map");
When loaded by a web browser, the
swim-ux.js script adds all
@swim/map library exports to the global
swim-ux.js script requires that
have already been loaded.
swim-system.js script also adds all @swim/map library exports
to the global
swim namespace, making it a drop-in replacement for
swim-ux.js when additional
@swim/system libraries are needed.