in src/chicletSlicer.ts [633:706]
private initContainer() {
let settings: ChicletSlicerSettings = this.settings,
slicerBodyViewport: IViewport = this.getSlicerBodyViewport(this.currentViewport);
let slicerContainer: Selection<any> = d3.select(this.$root.get(0))
.append('div')
.classed(ChicletSlicer.ContainerSelector.class, true);
this.slicerHeader = slicerContainer
.append('div')
.classed(ChicletSlicer.HeaderSelector.class, true);
this.slicerHeader
.append('span')
.classed(ChicletSlicer.ClearSelector.class, true)
.attr('title', 'Clear');
this.slicerHeader
.append('div')
.classed(ChicletSlicer.HeaderTextSelector.class, true)
.style({
'margin-left': PixelConverter.toString(settings.headerText.marginLeft),
'margin-top': PixelConverter.toString(settings.headerText.marginTop),
'border-style': this.getBorderStyle(settings.header.outline),
'border-color': settings.header.outlineColor,
'border-width': this.getBorderWidth(settings.header.outline, settings.header.outlineWeight),
'font-size': PixelConverter.fromPoint(settings.header.textSize),
});
this.createSearchHeader($(slicerContainer.node()));
this.slicerBody = slicerContainer
.append('div')
.classed(ChicletSlicer.BodySelector.class, true)
.classed(
ChicletSlicer.SlicerBodyHorizontalSelector.class,
settings.general.orientation === Orientation.HORIZONTAL)
.classed(
ChicletSlicer.SlicerBodyVerticalSelector.class,
settings.general.orientation === Orientation.VERTICAL
)
.style({
'height': PixelConverter.toString(slicerBodyViewport.height),
'width': `${ChicletSlicer.MaxImageWidth}%`,
});
let rowEnter = (rowSelection: Selection<any>) => {
this.enterSelection(rowSelection);
};
let rowUpdate = (rowSelection: Selection<any>) => {
this.updateSelection(rowSelection);
};
let rowExit = (rowSelection: Selection<any>) => {
rowSelection.remove();
};
let tableViewOptions: TableViewViewOptions = {
rowHeight: this.getRowHeight(),
columnWidth: this.settings.slicerText.width,
orientation: this.settings.general.orientation,
rows: this.settings.general.rows,
columns: this.settings.general.columns,
enter: rowEnter,
exit: rowExit,
update: rowUpdate,
scrollEnabled: true,
viewport: this.getSlicerBodyViewport(this.currentViewport),
baseContainer: this.slicerBody,
};
this.tableView = TableViewFactory.createTableView(tableViewOptions);
}