/** * Created by mm28969 on 10/24/16. */ // declare let d3; // import * as d3 from "d3"; import {Theme, ChartDrawArea} from "../mmviz-common/index"; export enum AxisLocationEnum { TOP = 1, RIGHT, BOTTOM, LEFT } /** * Get AxisLocationEnum that matches provided axisLocation string * @param axisLocation */ export function getAxisLocationEnum(axisLocation: string): AxisLocationEnum { let axisLocationEnum: AxisLocationEnum; switch (axisLocation){ case "top": axisLocationEnum = AxisLocationEnum.TOP; break; case "right": axisLocationEnum = AxisLocationEnum.RIGHT; break; case "bottom": axisLocationEnum = AxisLocationEnum.BOTTOM; break; case "left": axisLocationEnum = AxisLocationEnum.LEFT; break; default: throw "Invaild axis location"; } return axisLocationEnum; } export enum AxisTypeEnum { LINEAR = 1, ORDINAL, } export function getAxisSelector(locationEnum: AxisLocationEnum): string { let selector = ".axis"; switch (locationEnum) { case AxisLocationEnum.TOP: selector = ".axis-top"; break; case AxisLocationEnum.RIGHT: selector = ".axis-right"; break; case AxisLocationEnum.BOTTOM: selector = ".axis-bottom"; break; case AxisLocationEnum.LEFT: selector = ".axis-left"; break; default: break; } return selector; } function axisBottomLabelLeftLayout(label, drawArea: ChartDrawArea){ let theme: Theme = Theme.getInstance(), x = drawArea.left, y = drawArea.height - (theme.textAxisLabelSize * 0.2); return { x: x, y: y, rotation: 0, textAnchor: 'left', label: label }; } function axisBottomLabelCenterLayout(label, drawArea: ChartDrawArea){ let theme: Theme = Theme.getInstance(), x = (drawArea.width * 0.5), y = drawArea.height - (theme.textAxisLabelSize * 0.2); return { x: x, y: y, rotation: 0, textAnchor: 'middle', label: label }; } function axisLeftLabelLeftLayout(label, drawArea: ChartDrawArea){ let theme: Theme = Theme.getInstance(), x = 0, y = theme.textAxisLabelSize; return { x: x, y: y, rotation: 0, textAnchor: 'left', label: label }; } function axisLeftLabelCenterLayout(label, drawArea: ChartDrawArea){ let theme: Theme = Theme.getInstance(), x = theme.textAxisLabelSize * 0.8, y = (drawArea.height * 0.5); return { x: x, y: y, rotation: -90, textAnchor: 'middle', label: label }; } function axisRightLabelLayout(label, drawArea: ChartDrawArea){ let x = drawArea.width, y = (drawArea.height * 0.5); return { x: x, y: y, rotation: -90, textAnchor: 'middle', label: label }; } export function axisLayouter(locationEnum: AxisLocationEnum, layoutScale, dataModel) { let l, range, scale, tickSize, axisViewModel: any = {}, labelViewModel, drawArea = layoutScale.drawArea; switch (locationEnum) { case AxisLocationEnum.TOP: l = {x: 0, y: drawArea.height - drawArea.bottom}; range = drawArea.rangeX; tickSize = drawArea.drawHeight; scale = layoutScale.xScale; break; case AxisLocationEnum.RIGHT: l = {x: drawArea.left, y: 0}; range = drawArea.rangeReverseY; tickSize = drawArea.drawWidth; scale = layoutScale.yScale; if (dataModel.label) { labelViewModel = axisRightLabelLayout(dataModel.label, drawArea); } break; case AxisLocationEnum.BOTTOM: l = {x: 0, y: drawArea.top}; range = drawArea.rangeX; tickSize = drawArea.drawHeight; scale = layoutScale.xScale; if (dataModel.label) { labelViewModel = axisBottomLabelLeftLayout(dataModel.label, drawArea); } break; case AxisLocationEnum.LEFT: l = {x: drawArea.width - drawArea.right, y: 0}; range = drawArea.rangeReverseY; tickSize = drawArea.drawWidth; scale = layoutScale.yScale; if (dataModel.label) { labelViewModel = axisLeftLabelLeftLayout(dataModel.label, drawArea); } break; default: break; } axisViewModel.labelViewModel = labelViewModel; axisViewModel.x = l.x; axisViewModel.y = l.y; axisViewModel.scale = scale; axisViewModel.locationEnum = locationEnum; axisViewModel.tickSize = tickSize; return axisViewModel; }