src/Canvas.ts

   1/**

   2 * # Canvas

   3 * renders the graph's background.

   4 * 

   5 * ### Attributes

   6 * The `Canvas` class is called by {@link Graph.Graph `Graph`} as 

   7 * `m(Canvas, { cfg:cfg.canvas}))`

   8 * with the following attributes:

   9 * - cfg: a {@link Canvas.CanvasConfig `CanvasConfig`} configuration object

  10 * 

  11 * ### Configurations and Defaults

  12 * See {@link Canvas.Canvas.defaultConfig Canvas.defaultConfig}

  13 */

  14

  15/** */

  16export const m = require("mithril");

  17export type Vnode = typeof m.Vnode;

  18import { SVGElem, Area }        from './SVGElem';

  19import { Config, VisibleCfg }   from './Graph';

  20

  21

  22/** Defines configurable settings. */

  23export interface CanvasConfig extends VisibleCfg{

  24    range?:  Area;              // graph width and height

  25}

  26

  27export class Canvas extends SVGElem {

  28    /** 

  29     * Defines default values for all configurable parameters in `Graph`.

  30     * See {@link Graph.Graph.makeConfig Graph.makeConfig} for the sequence of initializations.

  31     * 

  32     * ### Configurations and Defaults

  33     * ```

  34     *  cfg.canvas = {@link Canvas.CanvasConfig }{

  35     *     range: {         // the graphs background rect:

  36     *        w: 100,       //    width

  37     *        h: 100,       //    height

  38     *        wunit:'%',    //    unit for width

  39     *        hunit:'%'     //    unit for height

  40     *     }   

  41     *  } 

  42     * ``` 

  43     * @param cfg the configuration object, containing default settings for all 

  44     * previously configured components. 

  45     */

  46    static defaultConfig(cfg:Config) {

  47        cfg.canvas = {

  48            range:  // graph width and height

  49                w: 100, wunit:'%',

  50                h: 100, hunit:'%'

  51            }  

  52        };

  53    }

  54

  55    /**

  56     * Makes adjustments to cfg based on current settings

  57     * @param cfg the configuration object, containing default settings for all components

  58     */

  59    static adjustConfig(cfg:Config) {

  60    }

  61    

  62    view(node?: Vnode): Vnode {

  63        const cg = node.attrs.cfg;

  64        return m('svg', {class:'hs-graph-canvas', width:'100%', height:'100%'}, [

  65            this.rect({x:0, y:0},

  66                { w:cg.range.w, h:cg.range.h, wunit:cg.range.wunit, hunit:cg.range.hunit},

  67                '' // style string

  68            )

  69        ]);

  70    }

  71}

  72

  73