/

Installation

dotAtlas comes as an NPM dependency, UNPKG CDN download and also as a traditional ZIP distribution package. Choose the one that best suits your workflow.

NPM dependency

Both the demo and licensed version of dotAtlas are available as NPM dependencies for a modern web application development workflows.

To add the dotAtlas demo version to your project, run: 

npm install @carrotsearch/dotatlas

or

yarn add @carrotsearch/dotatlas

Once the dotAtlas dependency is installed, you can import the DotAtlas class and plugin classes as follows: 

import { DotAtlas, Theme, Effects } from "@carrotsearch/dotatlas";

const dotAtlas = DotAtlas.with(Theme, Effects).embed({ ... });

If you hold a dotAtlas license, see the licensed version section for installation instructions.

Distribution package

For traditional plain old JavaScript workflows, use the dotAtlas ZIP distribution archive. The contents of the archive is the following:

Contents

dotAtlas distribution archive contains the following files:

Path Description
api/

This documentation.
cookbook/

Self-contained code examples demonstrating specific aspects of dotAtlas.
dotatlas.js

dotAtlas implementation in the ES6 modules format, minified.
dotatlas.min.js

dotAtlas implementation in the ES5 globals format, minified.
plugin.*.js, plugin.*.min.js

dotAtlas plugins in the ES6 modules and the ES5 globals format, respectively. The plugins come as source code under the Apache Software License 2.0, so feel free to copy and modify them as desired.

Installation

The way you reference dotAtlas in your page depends on whether you choose the ES6 modules or the ES5 globals packaging.

ES5 globals

To use the ES5 globals flavor, include the desired *.min.js scripts in your page and use the global symbols they provide. The following example uses the DotAtlas class along with the Theme plugins: 

<body>
  <script src="dotatlas.min.js"></script>
  <script src="plugin.theme.min.js"></script>

  <script>
    var dotAtlas = DotAtlas.with(Theme).embed({ ... });
  </script>
</body>

ES6 modules

The support for ES6 modules in modern browsers is very good and you can use this format with dotAtlas too. The following example uses the main DotAtlas class and the Theme plugin. Note the type="module" attribute added to the script tag and the fact that we now import from the *.js versions of the scripts. 

<body>
  <script type="module">
    import { DotAtlas, Theme } from "./index.js";

    const dotAtlas = DotAtlas.with(Theme).embed({ ... });
  </script>
</body>

UNPKG CDN

The demo version of dotAtlas is also available on the UNPKG CDN, ready to be directly imported into your page.

To reference the latest available version, use the following URL: 

https://unpkg.com/@carrotsearch/dotatlas/dotatlas.js

To reference a specific version, use an URL similar to: 

https://unpkg.com/@carrotsearch/dotatlas@%NPM_VERSION%/dotatlas.js

Note that the UNPKG CDN contains all the JavaScript files available in the distribution package, for example:

dotAtlas ES6 modules variant: 

https://unpkg.com/@carrotsearch/dotatlas@%NPM_VERSION%/dotatlas.js

dotAtlas ES5 globals variant: 

https://unpkg.com/@carrotsearch/dotatlas@%NPM_VERSION%/dotatlas.min.js

dotAtlas themes plugin, ES6 modules variant: 

https://unpkg.com/@carrotsearch/dotatlas@%NPM_VERSION%/plugin.theme.js

Licensed version

If you purchased a commercial license, the no-logo version of dotAtlas is available as an NPM dependency and a downloadable distribution package. A CDN download is not provided in this case.

The dotAtlas license file is only required to download the licensed version package. It is not required at runtime.

NPM dependency

The NPM version of licensed dotAtlas is available from our servers through a special URL. To add the licensed dotAtlas dependency to your project:

  1. Upload your dotAtlas license file at https://secure.carrotsearch.com.

  2. Copy the URL of the "npm" link under the dotAtlas version you'd like to install.

    Carrot Search software downloads site, link to the dependency in the npm format

  3. Paste the copied link to your package.json as follows: 

    {
  "dependencies": {
    "@carrotsearch/dotatlas": "https://secure.carrotsearch.com/download/dotatlas/0.3.0?22f5459e5fb781164d4eab1b0db6a665a6f1e9046957180ed315f72858b0ef9ec8f2d7b61cbc6bffef8303a28f00d95cea267f99826fc55b856427629cff10e6221e593704d4672f3e41d5e1d80a17113d2999b7061256d1f94e5c41408278747758e60053e2d054e397acdc03dbf9516bb8877c8941897bc2cfc575352ec6d9f7587ec830f79ce56354a23b57ce3f651898a52cb71f3f9a501110dee484f59f6ae12626b71d4252bb5022b9bca57893946e69b7fbb9a5df343742dc7068a2817f71cef11c49532bc2903a70c6aff4bf065d35defc3546c05b277028236a6c1596375b477f4a187a7cfb16f49dcb3f8720a6ef96c4cddcaca8c991f7389e19e5"
  }
}

    The hexadecimal data included in the query string of the URL represents your dotAtlas license file and allows our servers to determine which dotAtlas versions your license file covers.

    Alternatively, you can download the *.tgz file from the copied link, store it together with your code and reference the downloaded *.tgz file in your package.json.

  4. Once the dotAtlas dependency is installed, import the DotAtlas class and plugin classes as follows: 

    import { DotAtlas, Theme, Effects } from "@carrotsearch/dotatlas";

const dotAtlas = DotAtlas.with(Theme, Effects).embed({ ... });

Distribution package

To use the licensed dotAtlas distribution package:

  1. Upload your dotAtlas license file at https://secure.carrotsearch.com.

    Carrot Search software downloads site

  2. Click the "zip" link under the dotAtlas version you would like to use.

  3. Once the archive downloads, follow the distribution package instructions.