Skip to content

Extending the Framework

Gordon Smith edited this page Sep 5, 2018 · 11 revisions

v2.x.x

Setting up a development environment

Prerequisites

Create a working folder

git clone https://github.com/hpcc-systems/Visualization.git hpcc-js
cd hpcc-js
git checkout candidate-2.x.x
npm install
npm run build-dev

v1.x.x

Setting up a development environment

Prerequisites

Create a working folder

mkdir ./someDir
cd ./someDir
git clone https://github.com/hpcc-systems/Visualization.git
cd Visualization
git checkout candidate-1.14.x
npm install -g gulp
npm install -g bower
npm install
bower install

A quick way to test your environment is to launch the unit tests:

npm test

Adding a third-party library

1 - Add to bower.json:

...
"javascript-auto-complete": "*"
...

2 - Add to src/config.js: You will need to add the reference twice. Once for local usage and the other for "previewing" directly on GitHub.

...
//  For local hosting
"auto-complete": "../bower_components/javascript-auto-complete/auto-complete",
...
//  For GitHub hosting
"auto-complete": "//" + window.location.hostname + "/Pixabay/JavaScript-autoComplete/master/auto-complete",

3 - Add to JavaScript file as needed:

"use strict";
(function (root, factory) {
    if (typeof define === "function" && define.amd) {
        define(["d3", "../common/SVGWidget", ...,  "auto-complete", "css!./auto-complete"], factory);
    } else {
        root.graph_Sankey = factory(root.d3, root.common_SVGWidget, ..., root.autoComplete);
    }
}(this, function (d3, SVGWidget, ..., autoComplete) {
...