all files / candela/components/LineChart/ index.js

81.36% Statements 48/59
83.78% Branches 31/37
66.67% Functions 8/12
43.75% Lines 7/16
11 statements, 2 functions, 16 branches Ignored     
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66                                                                                                                        
import VisComponent from '../../VisComponent';
import Events from '../../VisComponent/mixin/Events';
import VegaChart from '../../VisComponent/mixin/VegaChart';
import spec from './spec.json';
 
export default class LineChart extends Events(VegaChart(VisComponent, spec)) {
  static get options () {
    return [
      {
        name: 'data',
        type: 'table',
        format: 'objectlist'
      },
      {
        name: 'x',
        type: 'string',
        format: 'text',
        domain: {
          mode: 'field',
          from: 'data',
          fieldTypes: ['date', 'number', 'integer', 'boolean']
        }
      },
      {
        name: 'y',
        type: 'string_list',
        format: 'string_list',
        domain: {
          mode: 'field',
          from: 'data',
          fieldTypes: ['date', 'number', 'integer', 'boolean']
        }
      },
      {
        name: 'hover',
        type: 'string_list',
        format: 'string_list',
        optional: true,
        domain: {
          mode: 'field',
          from: 'data',
          fieldTypes: ['string', 'date', 'number', 'integer', 'boolean']
        }
      }
    ];
  }
 
  constructor (...args) {
    super(...args);
 
    // Attach a listener to the chart.
    this.chart.then(chart => {
      chart.on('click', (event, item) => {
        if (item && item.mark.marktype === 'symbol') {
          const datum = Object.assign({}, item.datum);
          delete datum._id;
          delete datum._prev;
 
          this.emit('click', datum, item);
        }
      });
    });
  }
}