1234567891011121314151617181920212223242526272829303132 |
- const events = require('events');
- const d3 = require('../d3.js');
- class Walkthrough extends events.EventEmitter {
- constructor({ container }) {
- super();
- this._container = d3.select(container);
- this._steps = this._container.selectAll('.ar-walkthrough-step');
- this._pages = this._container.selectAll('.ar-walkthrough-page')
- .on('click', (d) => this.emit('click', d));
- const itemNumbers = this._steps.nodes()
- .map((element, index) => index + 1);
- this._pages.data(itemNumbers);
- this._steps.data(itemNumbers);
- this._selectedItem = 1;
- }
- select(itemNumber) {
- this._selectedItem = itemNumber;
- }
- draw() {
- this._steps
- .classed('ar-walkthrough-selected', (d) => d === this._selectedItem);
- }
- }
- module.exports = Walkthrough;
|