chartwerk
/
core
4
0
Fork 0
Code Issues 20 Pull Requests Projects Releases Wiki Activity
Browse Source

use rest of options

merge-requests/18/head
vargburz 2 years ago
parent
21c8a6c986
commit
935a1dfb5c
2 changed files with 55 additions and 47 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 76
      src/index.ts
  2. 26
      src/models/options.ts

76
src/index.ts
Unescape View File

@ -330,8 +330,8 @@ abstract class ChartwerkPod<T extends CoreSerie, O extends Options> {
protected addEvents(): void {
// TODO: refactor for a new mouse/scroll events
const panKeyEvent = this.options.zoomEvents.mouse.pan.keyEvent;
const isPanActive = this.options.zoomEvents.mouse.pan.isActive;
const panKeyEvent = this.coreOptions.mousePanEvent.keyEvent;
const isPanActive = this.coreOptions.mousePanEvent.isActive;
if(isPanActive === true && panKeyEvent === KeyEvent.MAIN) {
this.initPan();
this.initBrush();
@ -348,11 +348,11 @@ abstract class ChartwerkPod<T extends CoreSerie, O extends Options> {
}
protected initBrush(): void {
const isBrushActive = this.options.zoomEvents.mouse.zoom.isActive;
const isBrushActive = this.coreOptions.mouseZoomEvent.isActive;
if(isBrushActive === false) {
return;
}
switch(this.options.zoomEvents.mouse.zoom.orientation) {
switch(this.coreOptions.mouseZoomEvent.orientation) {
case BrushOrientation.VERTICAL:
this.brush = d3.brushY();
break;
@ -366,7 +366,7 @@ abstract class ChartwerkPod<T extends CoreSerie, O extends Options> {
default:
this.brush = d3.brushX();
}
const keyEvent = this.options.zoomEvents.mouse.zoom.keyEvent;
const keyEvent = this.coreOptions.mouseZoomEvent.keyEvent;
this.brush.extent([
[0, 0],
[this.width, this.height]
@ -404,13 +404,13 @@ abstract class ChartwerkPod<T extends CoreSerie, O extends Options> {
protected initPan(): void {
if(
this.options.zoomEvents.mouse.pan.isActive === false &&
this.options.zoomEvents.scroll.pan.isActive === false &&
this.options.zoomEvents.scroll.zoom.isActive === false
this.coreOptions.mousePanEvent.isActive === false &&
this.coreOptions.scrollPanEvent.isActive === false &&
this.coreOptions.scrollZoomEvent.isActive === false
) {
return;
}
if(this.options.zoomEvents.mouse.zoom.isActive === false) {
if(this.coreOptions.mouseZoomEvent.isActive === false) {
// init cumstom overlay to handle all events
this.customOverlay = this.chartContainer.append('rect')
.attr('class', 'custom-overlay')
@ -446,7 +446,7 @@ abstract class ChartwerkPod<T extends CoreSerie, O extends Options> {
}
protected renderLegend(): void {
if(this.options.renderLegend === false) {
if(this.coreOptions.allOptions.renderLegend === false) {
return;
}
if(!this.coreSeries.isSeriesAvailable) {
@ -530,12 +530,12 @@ abstract class ChartwerkPod<T extends CoreSerie, O extends Options> {
private disableScrollForward(event: any): boolean {
return event.sourceEvent.wheelDelta > 0
&& this.options.zoomEvents.scroll.pan.direction === ScrollPanDirection.FORWARD;
&& this.coreOptions.scrollPanEvent.direction === ScrollPanDirection.FORWARD;
}
private disableScrollBackward(event: any): boolean {
return event.sourceEvent.wheelDelta < 0
&& this.options.zoomEvents.scroll.pan.direction === ScrollPanDirection.BACKWARD;
&& this.coreOptions.scrollPanEvent.direction === ScrollPanDirection.BACKWARD;
}
protected onPanning(): void {
@ -549,14 +549,10 @@ abstract class ChartwerkPod<T extends CoreSerie, O extends Options> {
}
this.rescaleMetricAndAxis(event);
if(this.options.eventsCallbacks !== undefined && this.options.eventsCallbacks.panning !== undefined) {
this.options.eventsCallbacks.panning({
ranges: [this.state.xValueRange, this.state.yValueRange, this.state.y1ValueRange],
d3Event: event
});
} else {
console.log('on panning, but there is no callback');
}
this.coreOptions.callbackPanning({
ranges: [this.state.xValueRange, this.state.yValueRange, this.state.y1ValueRange],
d3Event: event
});
}
public rescaleMetricAndAxis(event: d3.D3ZoomEvent<any, any>): void {
@ -575,8 +571,8 @@ abstract class ChartwerkPod<T extends CoreSerie, O extends Options> {
protected onPanningRescale(event: d3.D3ZoomEvent<any, any>): void {
// rescale metrics and axis on mouse and scroll panning
const eventType = event.sourceEvent.type; // 'wheel' or 'mousemove'
const scrollPanOptions = this.options.zoomEvents.scroll.pan;
const scrollZoomOptions = this.options.zoomEvents.scroll.zoom;
const scrollPanOptions = this.coreOptions.scrollPanEvent;
const scrollZoomOptions = this.coreOptions.scrollZoomEvent;
// TODO: maybe use switch and move it to onPanning
if(eventType === 'wheel') {
if(scrollPanOptions.isActive === true && this.isD3EventKeyEqualOption(event, scrollPanOptions.keyEvent)) {
@ -609,7 +605,7 @@ abstract class ChartwerkPod<T extends CoreSerie, O extends Options> {
return;
}
const panOrientation = this.options.zoomEvents.mouse.pan.orientation;
const panOrientation = this.coreOptions.mousePanEvent.orientation;
if(panOrientation === PanOrientation.HORIZONTAL || panOrientation === PanOrientation.BOTH) {
this.rescaleAxisX(event.transform.x);
}
@ -642,7 +638,7 @@ abstract class ChartwerkPod<T extends CoreSerie, O extends Options> {
}
protected onScrollPanningRescale(event: d3.D3ZoomEvent<any, any>): void {
const scrollPanOptions = this.options.zoomEvents.scroll.pan;
const scrollPanOptions = this.coreOptions.scrollPanEvent;
// TODO: event.transform.y / x depends on mouse position, so we use hardcoded const, which should be removed
const transformStep = scrollPanOptions.panStep;
const scrollPanOrientation = scrollPanOptions.orientation;
@ -659,7 +655,7 @@ abstract class ChartwerkPod<T extends CoreSerie, O extends Options> {
case ScrollPanOrientation.VERTICAL:
// @ts-ignore
let signY = Math.sign(event.transform.y);
if(this.options.axis.y.invert === true) {
if(this.coreOptions.axis.y.invert === true) {
signY = -signY;
}
let rangeY = this.state.yValueRange;
@ -683,16 +679,12 @@ abstract class ChartwerkPod<T extends CoreSerie, O extends Options> {
this.isPanning = false;
this.deltaYTransform = 0;
this.onMouseOut();
if(this.options.eventsCallbacks !== undefined && this.options.eventsCallbacks.panningEnd !== undefined) {
this.options.eventsCallbacks.panningEnd([this.state.xValueRange, this.state.yValueRange, this.state.y1ValueRange]);
} else {
console.log('on panning end, but there is no callback');
}
this.coreOptions.callbackPanningEnd([this.state.xValueRange, this.state.yValueRange, this.state.y1ValueRange]);
}
protected onBrush(): void {
const selection = d3.event.selection;
if(this.options.zoomEvents.mouse.zoom.orientation !== BrushOrientation.SQUARE || selection === null) {
if(this.coreOptions.mouseZoomEvent.orientation !== BrushOrientation.SQUARE || selection === null) {
return;
}
const selectionAtts = this.getSelectionAttrs(selection);
@ -748,7 +740,7 @@ abstract class ChartwerkPod<T extends CoreSerie, O extends Options> {
let xRange: [number, number];
let yRange: [number, number];
switch(this.options.zoomEvents.mouse.zoom.orientation) {
switch(this.coreOptions.mouseZoomEvent.orientation) {
case BrushOrientation.HORIZONTAL:
const startTimestamp = this.xScale.invert(extent[0]);
const endTimestamp = this.xScale.invert(extent[1]);
@ -788,11 +780,7 @@ abstract class ChartwerkPod<T extends CoreSerie, O extends Options> {
this.brushStartSelection = null;
}
if(this.options.eventsCallbacks !== undefined && this.options.eventsCallbacks.zoomIn !== undefined) {
this.options.eventsCallbacks.zoomIn([xRange, yRange]);
} else {
console.log('zoom in, but there is no callback');
}
this.coreOptions.callbackZoomIn([xRange, yRange]);
}
protected zoomOut(): void {
@ -802,11 +790,7 @@ abstract class ChartwerkPod<T extends CoreSerie, O extends Options> {
x: xAxisMiddleValue,
y: yAxisMiddleValue
}
if(this.options.eventsCallbacks !== undefined && this.options.eventsCallbacks.zoomOut !== undefined) {
this.options.eventsCallbacks.zoomOut(centers);
} else {
console.log('zoom out, but there is no callback');
}
this.coreOptions.callbackZoomOut(centers);
}
// TODO: move to State
@ -837,10 +821,10 @@ abstract class ChartwerkPod<T extends CoreSerie, O extends Options> {
}
getd3TimeRangeEvery(count: number): d3.TimeInterval {
if(this.options.timeInterval === undefined || this.options.timeInterval.timeFormat === undefined) {
if(this.coreOptions.allOptions.timeInterval.timeFormat === undefined) {
return d3.timeMinute.every(count);
}
switch(this.options.timeInterval.timeFormat) {
switch(this.coreOptions.allOptions.timeInterval.timeFormat) {
case TimeFormat.SECOND:
return d3.utcSecond.every(count);
case TimeFormat.MINUTE:
@ -902,9 +886,9 @@ abstract class ChartwerkPod<T extends CoreSerie, O extends Options> {
const interval = this.coreSeries.visibleSeries[0].datapoints[1][0] - this.coreSeries.visibleSeries[0].datapoints[0][0];
return interval;
}
if(this.options.timeInterval !== undefined && this.options.timeInterval.count !== undefined) {
if(this.coreOptions.allOptions.timeInterval.count !== undefined) {
//TODO: timeFormat to timestamp
return this.options.timeInterval.count * MILISECONDS_IN_MINUTE;
return this.coreOptions.allOptions.timeInterval.count * MILISECONDS_IN_MINUTE;
}
return MILISECONDS_IN_MINUTE;
}

26
src/models/options.ts
Unescape View File

@ -4,7 +4,7 @@ import {
CrosshairOptions, CrosshairOrientation,
ZoomEvents, MouseZoomEvent, MousePanEvent, DoubleClickEvent, ScrollZoomEvent, ScrollPanEvent,
ScrollPanOrientation, ScrollPanDirection, PanOrientation, KeyEvent, BrushOrientation,
Margin, TimeFormat,
Margin, TimeFormat, AxisRange,
} from '../types';
import lodashDefaultsDeep from 'lodash/defaultsDeep';
@ -180,4 +180,28 @@ export class CoreOptions<O extends Options> {
this._options.eventsCallbacks.onLegendLabelClick(idx);
}
}
callbackPanning(event: { ranges: AxisRange[], d3Event: any }): void {
if(has(this._options.eventsCallbacks, 'panning')) {
this._options.eventsCallbacks.panning(event);
}
}
callbackPanningEnd(ranges: AxisRange[]): void {
if(has(this._options.eventsCallbacks, 'panningEnd')) {
this._options.eventsCallbacks.panningEnd(ranges);
}
}
callbackZoomIn(ranges: AxisRange[]): void {
if(has(this._options.eventsCallbacks, 'zoomIn')) {
this._options.eventsCallbacks.zoomIn(ranges);
}
}
callbackZoomOut(centers: { x: number, y: number }): void {
if(has(this._options.eventsCallbacks, 'zoomOut')) {
this._options.eventsCallbacks.zoomOut(centers);
}
}
}

Write Preview
Loading…
Cancel
Save