diff --git a/.gitignore b/.gitignore index 76efb07..03c1a21 100755 --- a/.gitignore +++ b/.gitignore @@ -1,2 +1,3 @@ node_modules .vscode +dist diff --git a/dist/VueChartwerkPodMixin.d.ts b/dist/VueChartwerkPodMixin.d.ts deleted file mode 100644 index f7b1af3..0000000 --- a/dist/VueChartwerkPodMixin.d.ts +++ /dev/null @@ -1,48 +0,0 @@ -declare const _default: { - props: { - id: { - type: StringConstructor; - required: boolean; - }; - series: { - type: ArrayConstructor; - required: boolean; - default: () => any[]; - }; - options: { - type: ObjectConstructor; - required: boolean; - default: () => {}; - }; - }; - watch: { - id(): void; - series(): void; - options(): void; - }; - mounted(): void; - destroyed(): void; - methods: { - render(): void; - renderSharedCrosshair(values: { - x?: number; - y?: number; - }): void; - hideSharedCrosshair(): void; - onPanningRescale(event: any): void; - renderChart(): void; - appendEvents(): void; - zoomIn(range: any): void; - zoomOut(centers: any): void; - mouseMove(evt: any): void; - mouseOut(): void; - onLegendClick(idx: any): void; - panningEnd(range: any): void; - panning(range: any): void; - contextMenu(evt: any): void; - sharedCrosshairMove(event: any): void; - renderStart(): void; - renderEnd(): void; - }; -}; -export default _default; diff --git a/dist/colors.d.ts b/dist/colors.d.ts deleted file mode 100644 index beda700..0000000 --- a/dist/colors.d.ts +++ /dev/null @@ -1 +0,0 @@ -export declare const palette: string[]; diff --git a/dist/components/grid.d.ts b/dist/components/grid.d.ts deleted file mode 100644 index 7700d9a..0000000 --- a/dist/components/grid.d.ts +++ /dev/null @@ -1,14 +0,0 @@ -import { GridOptions, SvgElParams } from '../types'; -import * as d3 from 'd3'; -export declare class Grid { - private _d3; - private _svgEl; - private _svgElParams; - protected gridOptions: GridOptions; - constructor(_d3: typeof d3, _svgEl: d3.Selection, _svgElParams: SvgElParams, _gridOptions: GridOptions); - protected setOptionDefaults(gridOptions: GridOptions): GridOptions; - render(): void; - renderGridLinesX(): void; - renderGridLinesY(): void; - updateStylesOfTicks(): void; -} diff --git a/dist/index.d.ts b/dist/index.d.ts deleted file mode 100644 index 1af1017..0000000 --- a/dist/index.d.ts +++ /dev/null @@ -1,112 +0,0 @@ -/// -import VueChartwerkPodMixin from './VueChartwerkPodMixin'; -import { PodState } from './state'; -import { Grid } from './components/grid'; -import { Margin, TimeSerie, Options, TickOrientation, TimeFormat, BrushOrientation, AxisFormat, CrosshairOrientation, SvgElementAttributes, KeyEvent, PanOrientation, yAxisOrientation, ScrollPanOrientation, ScrollPanDirection, AxisOption } from './types'; -import { palette } from './colors'; -import * as d3 from 'd3'; -declare abstract class ChartwerkPod { - protected readonly el: HTMLElement; - protected d3Node?: d3.Selection; - protected customOverlay?: d3.Selection; - protected crosshair?: d3.Selection; - protected brush?: d3.BrushBehavior; - protected zoom?: any; - protected svg?: d3.Selection; - protected state: PodState; - protected pan?: d3.ZoomBehavior; - protected clipPath?: any; - protected isPanning: boolean; - protected isBrushing: boolean; - protected brushStartSelection: [number, number] | null; - protected initScaleX?: d3.ScaleLinear; - protected initScaleY?: d3.ScaleLinear; - protected initScaleY1?: d3.ScaleLinear; - protected xAxisElement?: d3.Selection; - protected yAxisElement?: d3.Selection; - protected y1AxisElement?: d3.Selection; - protected yAxisTicksColors?: string[]; - private _clipPathUID; - protected series: T[]; - protected options: O; - protected readonly d3: typeof d3; - protected deltaYTransform: number; - protected debouncedRender: import("lodash").DebouncedFunc; - protected chartContainer: d3.Selection; - protected metricContainer: d3.Selection; - protected grid: Grid; - constructor(_d3: typeof d3, el: HTMLElement, _series: T[], _options: O); - protected addEventListeners(): void; - protected removeEventListeners(): void; - render(): void; - updateData(series?: T[], options?: O, shouldRerender?: boolean): void; - forceRerender(): void; - protected updateOptions(newOptions: O): void; - protected updateSeries(newSeries: T[]): void; - protected abstract renderMetrics(): void; - protected abstract onMouseOver(): void; - protected abstract onMouseOut(): void; - protected abstract onMouseMove(): void; - abstract renderSharedCrosshair(values: { - x?: number; - y?: number; - }): void; - abstract hideSharedCrosshair(): void; - protected initPodState(): void; - protected initComponents(): void; - protected renderMetricsContainer(): void; - protected createSvg(): void; - protected renderGrid(): void; - protected renderAxes(): void; - protected renderXAxis(): void; - protected renderYAxis(): void; - protected renderY1Axis(): void; - protected renderCrosshair(): void; - protected addEvents(): void; - protected initBrush(): void; - protected filterByKeyEvent(key: KeyEvent): () => boolean; - protected isD3EventKeyEqualOption(event: d3.D3ZoomEvent, optionsKeyEvent: KeyEvent): boolean; - protected initPan(): void; - protected renderClipPath(): void; - protected renderLegend(): void; - protected renderYLabel(): void; - protected renderXLabel(): void; - protected renderNoDataPointsMessage(): void; - private disableScrollForward; - private disableScrollBackward; - protected onPanning(): void; - rescaleMetricAndAxis(event: d3.D3ZoomEvent): void; - protected onPanningRescale(event: d3.D3ZoomEvent): void; - rescaleAxisX(transformX: number): void; - rescaleAxisY(transformY: number): void; - protected onScrollPanningRescale(event: d3.D3ZoomEvent): void; - protected onPanningEnd(): void; - protected onBrush(): void; - protected getSelectionAttrs(selection: number[][]): SvgElementAttributes | undefined; - protected onBrushStart(): void; - protected onBrushEnd(): void; - protected zoomOut(): void; - get absXScale(): d3.ScaleLinear; - get absYScale(): d3.ScaleLinear; - get xScale(): d3.ScaleLinear; - get yScale(): d3.ScaleLinear; - protected get y1Scale(): d3.ScaleLinear; - getd3TimeRangeEvery(count: number): d3.TimeInterval; - get serieTimestampRange(): number | undefined; - getAxisTicksFormatter(axisOptions: AxisOption): (d: any, i: number) => any; - get timeInterval(): number; - get xTickTransform(): string; - get extraMargin(): Margin; - get width(): number; - get height(): number; - get legendRowPositionY(): number; - get margin(): Margin; - formattedBound(alias: string, target: string): string; - protected clearState(): void; - protected getSerieColor(idx: number): string; - protected get seriesTargetsWithBounds(): any[]; - protected get visibleSeries(): any[]; - protected get rectClipId(): string; - isOutOfChart(): boolean; -} -export { ChartwerkPod, VueChartwerkPodMixin, Margin, TimeSerie, Options, TickOrientation, TimeFormat, BrushOrientation, PanOrientation, AxisFormat, yAxisOrientation, CrosshairOrientation, ScrollPanOrientation, ScrollPanDirection, KeyEvent, palette }; diff --git a/dist/index.js b/dist/index.js deleted file mode 100644 index afc9999..0000000 --- a/dist/index.js +++ /dev/null @@ -1 +0,0 @@ -!function(t,e){if("object"==typeof exports&&"object"==typeof module)module.exports=e();else if("function"==typeof define&&define.amd)define([],e);else{var n=e();for(var r in n)("object"==typeof exports?exports:t)[r]=n[r]}}(window,(function(){return function(t){var e={};function n(r){if(e[r])return e[r].exports;var i=e[r]={i:r,l:!1,exports:{}};return t[r].call(i.exports,i,i.exports,n),i.l=!0,i.exports}return n.m=t,n.c=e,n.d=function(t,e,r){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:r})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var i in t)n.d(r,i,function(e){return t[e]}.bind(null,i));return r},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=214)}([function(t,e,n){var r=n(93),i=n(54);t.exports=function(t,e){return null!=t&&i(t,e,r)}},function(t,e){var n=Array.isArray;t.exports=n},function(t,e){t.exports=function(t){var e=typeof t;return null!=t&&("object"==e||"function"==e)}},function(t,e,n){var r=n(56),i="object"==typeof self&&self&&self.Object===Object&&self,o=r||i||Function("return this")();t.exports=o},function(t,e){t.exports=function(t){return null!=t&&"object"==typeof t}},function(t,e,n){var r=n(29),i=n(78),o=n(14);t.exports=function(t){return t&&t.length?r(t,o,i):void 0}},function(t,e,n){var r=n(7),i=n(4);t.exports=function(t){return"symbol"==typeof t||i(t)&&"[object Symbol]"==r(t)}},function(t,e,n){var r=n(12),i=n(95),o=n(96),s=r?r.toStringTag:void 0;t.exports=function(t){return null==t?void 0===t?"[object Undefined]":"[object Null]":s&&s in Object(t)?i(t):o(t)}},function(t,e,n){var r=n(103),i=n(106);t.exports=function(t,e){var n=i(t,e);return r(n)?n:void 0}},function(t,e,n){var r=n(34),i=n(38);t.exports=function(t){return null!=t&&i(t.length)&&!r(t)}},function(t,e,n){var r=n(122);t.exports=function(t){return r(t,5)}},function(t,e,n){var r=n(29),i=n(73),o=n(14);t.exports=function(t){return t&&t.length?r(t,o,i):void 0}},function(t,e,n){var r=n(3).Symbol;t.exports=r},function(t,e,n){var r=n(62),i=n(133),o=n(9);t.exports=function(t){return o(t)?r(t):i(t)}},function(t,e){t.exports=function(t){return t}},function(t,e){t.exports=function(t,e){return t===e||t!=t&&e!=e}},function(t,e,n){var r=n(60),i=n(39);t.exports=function(t,e,n,o){var s=!n;n||(n={});for(var a=-1,c=e.length;++a-1&&t%1==0&&t-1&&t%1==0&&t<=9007199254740991}},function(t,e,n){var r=n(61);t.exports=function(t,e,n){"__proto__"==e&&r?r(t,e,{configurable:!0,enumerable:!0,value:n,writable:!0}):t[e]=n}},function(t,e){t.exports=function(t){return t.webpackPolyfill||(t.deprecate=function(){},t.paths=[],t.children||(t.children=[]),Object.defineProperty(t,"loaded",{enumerable:!0,get:function(){return t.l}}),Object.defineProperty(t,"id",{enumerable:!0,get:function(){return t.i}}),t.webpackPolyfill=1),t}},function(t,e,n){var r=n(132),i=n(27),o=n(42),s=o&&o.isTypedArray,a=s?i(s):r;t.exports=a},function(t,e,n){(function(t){var r=n(56),i=e&&!e.nodeType&&e,o=i&&"object"==typeof t&&t&&!t.nodeType&&t,s=o&&o.exports===i&&r.process,a=function(){try{var t=o&&o.require&&o.require("util").types;return t||s&&s.binding&&s.binding("util")}catch(t){}}();t.exports=a}).call(this,n(40)(t))},function(t,e){var n=Object.prototype;t.exports=function(t){var e=t&&t.constructor;return t===("function"==typeof e&&e.prototype||n)}},function(t,e,n){var r=n(139),i=n(66),o=Object.prototype.propertyIsEnumerable,s=Object.getOwnPropertySymbols,a=s?function(t){return null==t?[]:(t=Object(t),r(s(t),(function(e){return o.call(t,e)})))}:i;t.exports=a},function(t,e){t.exports=function(t,e){for(var n=-1,r=e.length,i=t.length;++n1&&s(t,e[0],e[1])?e=[]:n>2&&s(e[0],e[1],e[2])&&(e=[e[0]]),i(t,r(e,1),[])}));t.exports=a},function(t,e){var n=Array.prototype.reverse;t.exports=function(t){return null==t?t:n.call(t)}},function(t,e,n){var r=n(55),i=n(23),o=n(1),s=n(37),a=n(38),c=n(24);t.exports=function(t,e,n){for(var u=-1,f=(e=r(e,t)).length,l=!1;++uf))return!1;var h=c.get(t),p=c.get(e);if(h&&p)return h==e&&p==t;var v=-1,d=!0,y=2&n?new r:void 0;for(c.set(t,e),c.set(e,t);++ve}},function(t,e,n){var r=n(182)();t.exports=r},function(t,e){t.exports=function(t,e,n){switch(n.length){case 0:return t.call(e);case 1:return t.call(e,n[0]);case 2:return t.call(e,n[0],n[1]);case 3:return t.call(e,n[0],n[1],n[2])}return t.apply(e,n)}},function(t,e,n){var r=n(15),i=n(9),o=n(37),s=n(2);t.exports=function(t,e,n){if(!s(n))return!1;var a=typeof e;return!!("number"==a?i(n)&&o(e,n.length):"string"==a&&e in n)&&r(n[e],t)}},function(t,e,n){var r=n(25),i=n(83),o=n(79),s=n(193),a=n(2),c=n(17),u=n(84);t.exports=function t(e,n,f,l,h){e!==n&&o(n,(function(o,c){if(h||(h=new r),a(o))s(e,n,c,f,t,l,h);else{var p=l?l(u(e,c),o,c+"",e,n,h):void 0;void 0===p&&(p=o),i(e,c,p)}}),c)}},function(t,e,n){var r=n(39),i=n(15);t.exports=function(t,e,n){(void 0!==n&&!i(t[e],n)||void 0===n&&!(e in t))&&r(t,e,n)}},function(t,e){t.exports=function(t,e){if(("constructor"!==e||"function"!=typeof t[e])&&"__proto__"!=e)return t[e]}},function(t,e,n){var r=n(2),i=n(6),o=/^\s+|\s+$/g,s=/^[-+]0x[0-9a-f]+$/i,a=/^0b[01]+$/i,c=/^0o[0-7]+$/i,u=parseInt;t.exports=function(t){if("number"==typeof t)return t;if(i(t))return NaN;if(r(t)){var e="function"==typeof t.valueOf?t.valueOf():t;t=r(e)?e+"":e}if("string"!=typeof t)return 0===t?t:+t;t=t.replace(o,"");var n=a.test(t);return n||c.test(t)?u(t.slice(2),n?2:8):s.test(t)?NaN:+t}},function(t,e,n){var r=n(198),i=n(199);"string"==typeof(i=i.__esModule?i.default:i)&&(i=[[t.i,i,""]]);var o,s=0,a={injectType:"lazyStyleTag",insert:"head",singleton:!1},c={};c.locals=i.locals||{},c.use=function(){return s++||(o=r(i,a)),c},c.unuse=function(){s>0&&!--s&&(o(),o=null)},t.exports=c},function(t,e,n){var r=n(201),i=n(9),o=n(205),s=n(206),a=n(208),c=Math.max;t.exports=function(t,e,n,u){t=i(t)?t:a(t),n=n&&!u?s(n):0;var f=t.length;return n<0&&(n=c(f+n,0)),o(t)?n<=f&&t.indexOf(e,n)>-1:!!f&&r(t,e,n)>-1}},function(t,e,n){t.exports=n(210)},function(t,e){t.exports=function(t){var e=null==t?0:t.length;return e?t[e-1]:void 0}},function(t,e,n){var r=n(211)((function(t,e){return t+e}),0);t.exports=r},function(t,e,n){var r=n(58);t.exports=function(){var t=arguments,e=r(t[0]);return t.length<3?e:e.replace(t[1],t[2])}},function(t,e,n){var r=n(2),i=n(213),o=n(85),s=Math.max,a=Math.min;t.exports=function(t,e,n){var c,u,f,l,h,p,v=0,d=!1,y=!1,b=!0;if("function"!=typeof t)throw new TypeError("Expected a function");function x(e){var n=c,r=u;return c=u=void 0,v=e,l=t.apply(r,n)}function g(t){return v=t,h=setTimeout(O,e),d?x(t):l}function m(t){var n=t-p;return void 0===p||n>=e||n<0||y&&t-v>=f}function O(){var t=i();if(m(t))return A(t);h=setTimeout(O,function(t){var n=e-(t-p);return y?a(n,f-(t-v)):n}(t))}function A(t){return h=void 0,b&&c?x(t):(c=u=void 0,l)}function j(){var t=i(),n=m(t);if(c=arguments,u=this,p=t,n){if(void 0===h)return g(p);if(y)return clearTimeout(h),h=setTimeout(O,e),x(p)}return void 0===h&&(h=setTimeout(O,e)),l}return e=o(e)||0,r(n)&&(d=!!n.leading,f=(y="maxWait"in n)?s(o(n.maxWait)||0,e):f,b="trailing"in n?!!n.trailing:b),j.cancel=function(){void 0!==h&&clearTimeout(h),v=0,c=p=u=h=void 0},j.flush=function(){return void 0===h?l:A(i())},j}},function(t,e){var n=Object.prototype.hasOwnProperty;t.exports=function(t,e){return null!=t&&n.call(t,e)}},function(t,e){var n;n=function(){return this}();try{n=n||new Function("return this")()}catch(t){"object"==typeof window&&(n=window)}t.exports=n},function(t,e,n){var r=n(12),i=Object.prototype,o=i.hasOwnProperty,s=i.toString,a=r?r.toStringTag:void 0;t.exports=function(t){var e=o.call(t,a),n=t[a];try{t[a]=void 0;var r=!0}catch(t){}var i=s.call(t);return r&&(e?t[a]=n:delete t[a]),i}},function(t,e){var n=Object.prototype.toString;t.exports=function(t){return n.call(t)}},function(t,e,n){var r=n(98),i=/[^.[\]]+|\[(?:(-?\d+(?:\.\d+)?)|(["'])((?:(?!\2)[^\\]|\\.)*?)\2)\]|(?=(?:\.|\[\])(?:\.|\[\]|$))/g,o=/\\(\\)?/g,s=r((function(t){var e=[];return 46===t.charCodeAt(0)&&e.push(""),t.replace(i,(function(t,n,r,i){e.push(r?i.replace(o,"$1"):n||t)})),e}));t.exports=s},function(t,e,n){var r=n(99);t.exports=function(t){var e=r(t,(function(t){return 500===n.size&&n.clear(),t})),n=e.cache;return e}},function(t,e,n){var r=n(33);function i(t,e){if("function"!=typeof t||null!=e&&"function"!=typeof e)throw new TypeError("Expected a function");var n=function(){var r=arguments,i=e?e.apply(this,r):r[0],o=n.cache;if(o.has(i))return o.get(i);var s=t.apply(this,r);return n.cache=o.set(i,s)||o,s};return n.cache=new(i.Cache||r),n}i.Cache=r,t.exports=i},function(t,e,n){var r=n(101),i=n(20),o=n(35);t.exports=function(){this.size=0,this.__data__={hash:new r,map:new(o||i),string:new r}}},function(t,e,n){var r=n(102),i=n(107),o=n(108),s=n(109),a=n(110);function c(t){var e=-1,n=null==t?0:t.length;for(this.clear();++e-1}},function(t,e,n){var r=n(21);t.exports=function(t,e){var n=this.__data__,i=r(n,t);return i<0?(++this.size,n.push([t,e])):n[i][1]=e,this}},function(t,e,n){var r=n(22);t.exports=function(t){var e=r(this,t).delete(t);return this.size-=e?1:0,e}},function(t,e){t.exports=function(t){var e=typeof t;return"string"==e||"number"==e||"symbol"==e||"boolean"==e?"__proto__"!==t:null===t}},function(t,e,n){var r=n(22);t.exports=function(t){return r(this,t).get(t)}},function(t,e,n){var r=n(22);t.exports=function(t){return r(this,t).has(t)}},function(t,e,n){var r=n(22);t.exports=function(t,e){var n=r(this,t),i=n.size;return n.set(t,e),this.size+=n.size==i?0:1,this}},function(t,e,n){var r=n(7),i=n(4);t.exports=function(t){return i(t)&&"[object Arguments]"==r(t)}},function(t,e,n){var r=n(25),i=n(128),o=n(60),s=n(129),a=n(135),c=n(64),u=n(65),f=n(138),l=n(140),h=n(68),p=n(141),v=n(28),d=n(146),y=n(147),b=n(72),x=n(1),g=n(26),m=n(152),O=n(2),A=n(154),j=n(13),S=n(17),_={};_["[object Arguments]"]=_["[object Array]"]=_["[object ArrayBuffer]"]=_["[object DataView]"]=_["[object Boolean]"]=_["[object Date]"]=_["[object Float32Array]"]=_["[object Float64Array]"]=_["[object Int8Array]"]=_["[object Int16Array]"]=_["[object Int32Array]"]=_["[object Map]"]=_["[object Number]"]=_["[object Object]"]=_["[object RegExp]"]=_["[object Set]"]=_["[object String]"]=_["[object Symbol]"]=_["[object Uint8Array]"]=_["[object Uint8ClampedArray]"]=_["[object Uint16Array]"]=_["[object Uint32Array]"]=!0,_["[object Error]"]=_["[object Function]"]=_["[object WeakMap]"]=!1,t.exports=function t(e,n,C,E,k,w){var T,R=1&n,M=2&n,F=4&n;if(C&&(T=k?C(e,E,k,w):C(e)),void 0!==T)return T;if(!O(e))return e;var P=x(e);if(P){if(T=d(e),!R)return u(e,T)}else{var I=v(e),z="[object Function]"==I||"[object GeneratorFunction]"==I;if(g(e))return c(e,R);if("[object Object]"==I||"[object Arguments]"==I||z&&!k){if(T=M||z?{}:b(e),!R)return M?l(e,a(T,e)):f(e,s(T,e))}else{if(!_[I])return k?e:{};T=y(e,I,R)}}w||(w=new r);var L=w.get(e);if(L)return L;w.set(e,T),A(e)?e.forEach((function(r){T.add(t(r,n,C,r,e,w))})):m(e)&&e.forEach((function(r,i){T.set(i,t(r,n,C,i,e,w))}));var B=P?void 0:(F?M?p:h:M?S:j)(e);return i(B||e,(function(r,i){B&&(r=e[i=r]),o(T,i,t(r,n,C,i,e,w))})),T}},function(t,e,n){var r=n(20);t.exports=function(){this.__data__=new r,this.size=0}},function(t,e){t.exports=function(t){var e=this.__data__,n=e.delete(t);return this.size=e.size,n}},function(t,e){t.exports=function(t){return this.__data__.get(t)}},function(t,e){t.exports=function(t){return this.__data__.has(t)}},function(t,e,n){var r=n(20),i=n(35),o=n(33);t.exports=function(t,e){var n=this.__data__;if(n instanceof r){var s=n.__data__;if(!i||s.length<199)return s.push([t,e]),this.size=++n.size,this;n=this.__data__=new o(s)}return n.set(t,e),this.size=n.size,this}},function(t,e){t.exports=function(t,e){for(var n=-1,r=null==t?0:t.length;++n0&&o(f)?n>1?t(f,n-1,o,s,a):r(a,f):s||(a[a.length]=f)}return a}},function(t,e,n){var r=n(12),i=n(23),o=n(1),s=r?r.isConcatSpreadable:void 0;t.exports=function(t){return o(t)||i(t)||!!(s&&t&&t[s])}},function(t,e,n){var r=n(36),i=n(49),o=n(48),s=n(179),a=n(184),c=n(27),u=n(185),f=n(14),l=n(1);t.exports=function(t,e,n){e=e.length?r(e,(function(t){return l(t)?function(e){return i(e,1===t.length?t[0]:t)}:t})):[f];var h=-1;e=r(e,c(o));var p=s(t,(function(t,n,i){return{criteria:r(e,(function(e){return e(t)})),index:++h,value:t}}));return a(p,(function(t,e){return u(t,e,n)}))}},function(t,e,n){var r=n(180),i=n(9);t.exports=function(t,e){var n=-1,o=i(t)?Array(t.length):[];return r(t,(function(t,r,i){o[++n]=e(t,r,i)})),o}},function(t,e,n){var r=n(181),i=n(183)(r);t.exports=i},function(t,e,n){var r=n(79),i=n(13);t.exports=function(t,e){return t&&r(t,e,i)}},function(t,e){t.exports=function(t){return function(e,n,r){for(var i=-1,o=Object(e),s=r(e),a=s.length;a--;){var c=s[t?a:++i];if(!1===n(o[c],c,o))break}return e}}},function(t,e,n){var r=n(9);t.exports=function(t,e){return function(n,i){if(null==n)return n;if(!r(n))return t(n,i);for(var o=n.length,s=e?o:-1,a=Object(n);(e?s--:++s=c?u:u*("desc"==n[i]?-1:1)}return t.index-e.index}},function(t,e,n){var r=n(6);t.exports=function(t,e){if(t!==e){var n=void 0!==t,i=null===t,o=t==t,s=r(t),a=void 0!==e,c=null===e,u=e==e,f=r(e);if(!c&&!f&&!s&&t>e||s&&a&&u&&!c&&!f||i&&a&&u||!n&&u||!o)return 1;if(!i&&!s&&!f&&t0){if(++e>=800)return arguments[0]}else e=0;return t.apply(void 0,arguments)}}},function(t,e,n){var r=n(82),i=n(2);t.exports=function t(e,n,o,s,a,c){return i(e)&&i(n)&&(c.set(n,e),r(e,n,void 0,t,c),c.delete(n)),e}},function(t,e,n){var r=n(83),i=n(64),o=n(71),s=n(65),a=n(72),c=n(23),u=n(1),f=n(194),l=n(26),h=n(34),p=n(2),v=n(195),d=n(41),y=n(84),b=n(196);t.exports=function(t,e,n,x,g,m,O){var A=y(t,n),j=y(e,n),S=O.get(j);if(S)r(t,n,S);else{var _=m?m(A,j,n+"",t,e,O):void 0,C=void 0===_;if(C){var E=u(j),k=!E&&l(j),w=!E&&!k&&d(j);_=j,E||k||w?u(A)?_=A:f(A)?_=s(A):k?(C=!1,_=i(j,!0)):w?(C=!1,_=o(j,!0)):_=[]:v(j)||c(j)?(_=A,c(A)?_=b(A):p(A)&&!h(A)||(_=a(j))):C=!1}C&&(O.set(j,_),g(_,j,x,m,O),O.delete(j)),r(t,n,_)}}},function(t,e,n){var r=n(9),i=n(4);t.exports=function(t){return i(t)&&r(t)}},function(t,e,n){var r=n(7),i=n(46),o=n(4),s=Function.prototype,a=Object.prototype,c=s.toString,u=a.hasOwnProperty,f=c.call(Object);t.exports=function(t){if(!o(t)||"[object Object]"!=r(t))return!1;var e=i(t);if(null===e)return!0;var n=u.call(e,"constructor")&&e.constructor;return"function"==typeof n&&n instanceof n&&c.call(n)==f}},function(t,e,n){var r=n(16),i=n(17);t.exports=function(t){return r(t,i(t))}},function(t,e,n){var r=n(50),i=n(81);t.exports=function(t){return r((function(e,n){var r=-1,o=n.length,s=o>1?n[o-1]:void 0,a=o>2?n[2]:void 0;for(s=t.length>3&&"function"==typeof s?(o--,s):void 0,a&&i(n[0],n[1],a)&&(s=o<3?void 0:s,o=1),e=Object(e);++r0)for(var e=this.chartContainer.append("g").attr("class","legend-row"),n=function(n){if(D()(r.seriesTargetsWithBounds,r.series[n].target))return"continue";var i=0;null!==e.selectAll("text").node()&&(i=e.node().getBBox().width+25);var o=!1!==r.series[n].visible;e.append("foreignObject").attr("x",i).attr("y",r.legendRowPositionY-12).attr("width",13).attr("height",15).html("
").on("click",(function(){void 0!==t.options.eventsCallbacks&&void 0!==t.options.eventsCallbacks.onLegendClick&&t.options.eventsCallbacks.onLegendClick(n)})),e.append("text").attr("x",i+20).attr("y",r.legendRowPositionY).attr("class","metric-legend-"+n).style("font-size","12px").style("fill",r.getSerieColor(n)).text(r.series[n].target).on("click",(function(){void 0!==t.options.eventsCallbacks&&void 0!==t.options.eventsCallbacks.onLegendLabelClick&&t.options.eventsCallbacks.onLegendLabelClick(n)}))},r=this,i=0;i0&&this.options.zoomEvents.scroll.pan.direction===c.FORWARD},t.prototype.disableScrollBackward=function(t){return t.sourceEvent.wheelDelta<0&&this.options.zoomEvents.scroll.pan.direction===c.BACKWARD},t.prototype.onPanning=function(){var t=this.d3.event;null!==t.sourceEvent&&void 0!==t.sourceEvent&&("wheel"===t.sourceEvent.type&&(this.disableScrollBackward(t)||this.disableScrollForward(t))||(this.rescaleMetricAndAxis(t),void 0!==this.options.eventsCallbacks&&void 0!==this.options.eventsCallbacks.panning?this.options.eventsCallbacks.panning({ranges:[this.state.xValueRange,this.state.yValueRange,this.state.y1ValueRange],d3Event:t}):console.log("on panning, but there is no callback")))},t.prototype.rescaleMetricAndAxis=function(t){this.isPanning=!0,this.onMouseOut(),this.onPanningRescale(t),this.renderYAxis(),this.renderXAxis(),this.chartContainer.select(".metrics-rect").attr("transform","translate("+this.state.transform.x+","+this.state.transform.y+"), scale("+this.state.transform.k+")")},t.prototype.onPanningRescale=function(t){var e=t.sourceEvent.type,n=this.options.zoomEvents.scroll.pan,r=this.options.zoomEvents.scroll.zoom;if("wheel"!==e){var i=this.options.zoomEvents.mouse.pan.orientation;i!==s.HORIZONTAL&&i!==s.BOTH||this.rescaleAxisX(t.transform.x),i!==s.VERTICAL&&i!==s.BOTH||this.rescaleAxisY(t.transform.y)}else{if(!0===n.isActive&&this.isD3EventKeyEqualOption(t,n.keyEvent))return void this.onScrollPanningRescale(t);if(!0===r.isActive&&this.isD3EventKeyEqualOption(t,r.keyEvent)){var o=r.orientation,a=void 0;switch(o){case s.HORIZONTAL:a=t.transform.k+",1",this.rescaleAxisX(t.transform.x);break;case s.VERTICAL:a="1,"+t.transform.k,this.rescaleAxisY(t.transform.y);break;case s.BOTH:a=t.transform.k,this.rescaleAxisX(t.transform.x),this.rescaleAxisY(t.transform.y);break;default:throw new Error("Unknown type of PanOrientation: "+o)}return void(this.state.transform.k=a)}}},t.prototype.rescaleAxisX=function(t){this.state.transform={x:t};var e=this.d3.event.transform.rescaleX(this.initScaleX);this.xAxisElement.call(this.d3.axisBottom(this.xScale).scale(e)),this.state.xValueRange=[e.invert(0),e.invert(this.width)]},t.prototype.rescaleAxisY=function(t){this.state.transform={y:t};var e=this.d3.event.transform.rescaleY(this.initScaleY);if(this.yAxisElement.call(this.d3.axisLeft(this.yScale).scale(e)),this.state.yValueRange=[e.invert(0),e.invert(this.height)],this.y1AxisElement){var n=this.d3.event.transform.rescaleY(this.initScaleY1);this.y1AxisElement.call(this.d3.axisLeft(this.y1Scale).scale(n)),this.state.y1ValueRange=[n.invert(0),n.invert(this.height)],this.y1AxisElement.selectAll("line").attr("x2",2),this.y1AxisElement.selectAll("text").attr("x",5)}},t.prototype.onScrollPanningRescale=function(t){var e=this.options.zoomEvents.scroll.pan,n=e.panStep,r=e.orientation;switch(r){case a.HORIZONTAL:var i=Math.sign(t.transform.x),o=this.absXScale.invert(Math.abs(n)),s=this.state.xValueRange;this.state.xValueRange=[s[0]+i*o,s[1]+i*o];var c=this.state.transform.x+i*n;this.state.transform={x:c};break;case a.VERTICAL:var u=Math.sign(t.transform.y);!0===this.options.axis.y.invert&&(u=-u);var f=this.state.yValueRange,l=this.absYScale.invert(n);if(this.deltaYTransform=this.deltaYTransform+n,this.deltaYTransform>.9*this.height)return;this.state.yValueRange=[f[0]-u*l,f[1]-u*l];var h=this.state.transform.y+u*n;this.state.transform={y:h};break;default:throw new Error("Unknown type of scroll pan orientation: "+r)}},t.prototype.onPanningEnd=function(){this.isPanning=!1,this.deltaYTransform=0,this.onMouseOut(),void 0!==this.options.eventsCallbacks&&void 0!==this.options.eventsCallbacks.panningEnd?this.options.eventsCallbacks.panningEnd([this.state.xValueRange,this.state.yValueRange,this.state.y1ValueRange]):console.log("on panning end, but there is no callback")},t.prototype.onBrush=function(){var t=this.d3.event.selection;if(this.options.zoomEvents.mouse.zoom.orientation===o.SQUARE&&null!==t){var e=this.getSelectionAttrs(t);void 0!==e&&this.chartContainer.select(".selection").attr("x",e.x).attr("y",e.y).attr("width",e.width).attr("height",e.height)}},t.prototype.getSelectionAttrs=function(t){if(null!==this.brushStartSelection&&null!=t){var e=this.brushStartSelection[0],n=this.brushStartSelection[1],r=t[0][0],i=t[1][0],o=t[0][1],s=i-r,a=t[1][1]-o,c=Math.min(s,a);return{x:r===e?e:e-c,y:o===n?n:n-c,width:c,height:c}}},t.prototype.onBrushStart=function(){this.isBrushing;var t=this.d3.event.selection;null!==t&&t.length>0&&(this.brushStartSelection=this.d3.event.selection[0]),this.onMouseOut()},t.prototype.onBrushEnd=function(){var t=this.d3.event.selection;if(this.isBrushing,null==t||t.length<2)console.warn("Chartwerk Core: skip brush end (no extent)");else{var e,n;switch(this.chartContainer.call(this.brush.move,null),this.options.zoomEvents.mouse.zoom.orientation){case o.HORIZONTAL:e=[this.xScale.invert(t[0]),this.xScale.invert(t[1])],this.state.xValueRange=e;break;case o.VERTICAL:n=[this.yScale.invert(t[0]),this.yScale.invert(t[1])],this.state.yValueRange=n;break;case o.RECTANGLE:e=[this.xScale.invert(t[0][0]),this.xScale.invert(t[1][0])],n=[this.yScale.invert(t[0][1]),this.yScale.invert(t[1][1])],this.state.xValueRange=e,this.state.yValueRange=n;break;case o.SQUARE:var r=this.getSelectionAttrs(t);if(void 0===r)break;e=[this.xScale.invert(r.x),this.xScale.invert(r.x+r.width)],n=[this.yScale.invert(r.y),this.yScale.invert(r.y+r.height)],this.state.xValueRange=e,this.state.yValueRange=n,this.brushStartSelection=null}void 0!==this.options.eventsCallbacks&&void 0!==this.options.eventsCallbacks.zoomIn?this.options.eventsCallbacks.zoomIn([e,n]):console.log("zoom in, but there is no callback")}},t.prototype.zoomOut=function(){if(!0!==this.isOutOfChart()){var t={x:this.xScale.invert(this.width/2),y:this.yScale.invert(this.height/2)};void 0!==this.options.eventsCallbacks&&void 0!==this.options.eventsCallbacks.zoomOut?this.options.eventsCallbacks.zoomOut(t):console.log("zoom out, but there is no callback")}},Object.defineProperty(t.prototype,"absXScale",{get:function(){var t=[0,Math.abs(this.state.getMaxValueX()-this.state.getMinValueX())];return this.d3.scaleLinear().domain(t).range([0,this.width])},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"absYScale",{get:function(){var t=[0,Math.abs(this.state.getMaxValueY()-this.state.getMinValueY())];return this.d3.scaleLinear().domain(t).range([0,this.height])},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"xScale",{get:function(){return this.state.xScale},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"yScale",{get:function(){return this.state.yScale},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"y1Scale",{get:function(){return this.state.y1Scale},enumerable:!1,configurable:!0}),t.prototype.getd3TimeRangeEvery=function(t){if(void 0===this.options.timeInterval||void 0===this.options.timeInterval.timeFormat)return this.d3.timeMinute.every(t);switch(this.options.timeInterval.timeFormat){case i.SECOND:return this.d3.utcSecond.every(t);case i.MINUTE:return this.d3.utcMinute.every(t);case i.HOUR:return this.d3.utcHour.every(t);case i.DAY:return this.d3.utcDay.every(t);case i.MONTH:return this.d3.utcMonth.every(t);case i.YEAR:return this.d3.utcYear.every(t);default:return this.d3.utcMinute.every(t)}},Object.defineProperty(t.prototype,"serieTimestampRange",{get:function(){if(0!==this.series.length){var t=H()(this.series[0].datapoints)[0];return(X()(this.series[0].datapoints)[0]-t)/1e3}},enumerable:!1,configurable:!0}),t.prototype.getAxisTicksFormatter=function(t){var e=this;if(0===t.ticksCount)return function(t){return""};switch(t.format){case u.TIME:return this.d3.timeFormat("%m/%d %H:%M");case u.NUMERIC:return function(t){return t};case u.STRING:throw new Error("Not supported AxisFormat type "+t.format+" yet");case u.CUSTOM:return void 0===t.valueFormatter?(console.warn("Value formatter for axis is not defined. Path options.axis.{?}.valueFormatter"),function(t){return t}):function(n,r){return void 0!==t.colorFormatter&&e.yAxisTicksColors.push(t.colorFormatter(n,r)),t.valueFormatter(n,r)};default:throw new Error("Unknown time format for axis: "+t.format)}},Object.defineProperty(t.prototype,"timeInterval",{get:function(){return void 0!==this.series&&this.series.length>0&&this.series[0].datapoints.length>1?this.series[0].datapoints[1][0]-this.series[0].datapoints[0][0]:void 0!==this.options.timeInterval&&void 0!==this.options.timeInterval.count?6e4*this.options.timeInterval.count:6e4},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"xTickTransform",{get:function(){if(void 0===this.options.tickFormat||void 0===this.options.tickFormat.xTickOrientation)return"";switch(this.options.tickFormat.xTickOrientation){case r.VERTICAL:return"translate(-10px, 50px) rotate(-90deg)";case r.HORIZONTAL:return"";case r.DIAGONAL:return"translate(-30px, 30px) rotate(-45deg)";default:return""}},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"extraMargin",{get:function(){var t={top:0,right:0,bottom:0,left:0};if(void 0!==this.options.tickFormat&&void 0!==this.options.tickFormat.xTickOrientation)switch(this.options.tickFormat.xTickOrientation){case r.VERTICAL:t.bottom+=80;break;case r.HORIZONTAL:break;case r.DIAGONAL:t.left+=15,t.bottom+=50,t.right+=10}return void 0!==this.options.labelFormat&&(void 0!==this.options.labelFormat.xAxis&&this.options.labelFormat.xAxis.length>0&&(t.bottom+=20),void 0!==this.options.labelFormat.yAxis&&this.options.labelFormat.yAxis.length>0&&(t.left+=20)),this.series.length>0&&(t.bottom+=25),t},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"width",{get:function(){return this.d3Node.node().clientWidth-this.margin.left-this.margin.right},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"height",{get:function(){return this.d3Node.node().clientHeight-this.margin.top-this.margin.bottom},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"legendRowPositionY",{get:function(){return this.height+this.margin.bottom-5},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"margin",{get:function(){return void 0!==this.options.margin?this.options.margin:Z()({},et,this.extraMargin,K.a)},enumerable:!1,configurable:!0}),t.prototype.formattedBound=function(t,e){return Q()(t,"$__metric_name",e)},t.prototype.clearState=function(){this.state.clearState()},t.prototype.getSerieColor=function(t){if(void 0===this.series[t])throw new Error("Can't get color for unexisting serie: "+t+", there are only "+this.series.length+" series");var e=this.series[t].color;return void 0===e&&(e=N[t%N.length]),e},Object.defineProperty(t.prototype,"seriesTargetsWithBounds",{get:function(){var t=this;if(void 0===this.options.bounds||void 0===this.options.bounds.upper||void 0===this.options.bounds.lower)return[];var e=[];return this.series.forEach((function(n){e.push(t.formattedBound(t.options.bounds.upper,n.target)),e.push(t.formattedBound(t.options.bounds.lower,n.target))})),e},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"visibleSeries",{get:function(){return this.series.filter((function(t){return!1!==t.visible}))},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"rectClipId",{get:function(){return 0===this._clipPathUID.length&&(this._clipPathUID=Math.random().toString(36).substr(2,12)),this._clipPathUID},enumerable:!1,configurable:!0}),t.prototype.isOutOfChart=function(){var t=this.d3.mouse(this.chartContainer.node()),e=t[0],n=t[1];return n>this.height+1||n<-1||e>this.width||e<0},t}()}])})); \ No newline at end of file diff --git a/dist/state.d.ts b/dist/state.d.ts deleted file mode 100644 index afe4358..0000000 --- a/dist/state.d.ts +++ /dev/null @@ -1,55 +0,0 @@ -import { TimeSerie, Options, yAxisOrientation } from './types'; -import * as d3 from 'd3'; -export declare class PodState { - protected _d3: typeof d3; - protected boxParams: { - height: number; - width: number; - }; - protected series: T[]; - protected options: O; - private _xValueRange; - private _yValueRange; - private _y1ValueRange; - private _transform; - private _xScale; - private _yScale; - private _y1Scale; - constructor(_d3: typeof d3, boxParams: { - height: number; - width: number; - }, series: T[], options: O); - protected setInitialRanges(): void; - protected initScales(): void; - protected setYScale(): void; - protected setXScale(): void; - protected setY1Scale(): void; - clearState(): void; - get yScale(): d3.ScaleLinear; - get xScale(): d3.ScaleLinear; - get y1Scale(): d3.ScaleLinear; - get xValueRange(): [number, number] | undefined; - get yValueRange(): [number, number] | undefined; - get y1ValueRange(): [number, number] | undefined; - get transform(): { - x?: number; - y?: number; - k?: number | string; - }; - set xValueRange(range: [number, number]); - set yValueRange(range: [number, number]); - set y1ValueRange(range: [number, number]); - set transform(transform: { - x?: number; - y?: number; - k?: number | string; - }); - getMinValueY(): number; - getMaxValueY(): number; - getMinValueX(): number; - getMaxValueX(): number; - getMinValueY1(): number; - getMaxValueY1(): number; - get isSeriesUnavailable(): boolean; - protected filterSerieByYAxisOrientation(serie: T, orientation: yAxisOrientation): boolean; -} diff --git a/dist/types.d.ts b/dist/types.d.ts deleted file mode 100644 index 6473b82..0000000 --- a/dist/types.d.ts +++ /dev/null @@ -1,194 +0,0 @@ -export declare type Margin = { - top: number; - right: number; - bottom: number; - left: number; -}; -export declare type Timestamp = number; -export declare type TimeSerie = { - target: string; - datapoints: [Timestamp, number][]; - alias?: string; - visible?: boolean; - color?: string; - yOrientation?: yAxisOrientation; -}; -export declare type Options = { - margin?: Margin; - confidence?: number; - eventsCallbacks?: { - zoomIn?: (range: AxisRange[]) => void; - panning?: (event: { - ranges: AxisRange[]; - d3Event: any; - }) => void; - panningEnd?: (range: AxisRange[]) => void; - zoomOut?: (centers: { - x: number; - y: number; - }) => void; - mouseMove?: (evt: any) => void; - mouseOut?: () => void; - onLegendClick?: (idx: number) => void; - onLegendLabelClick?: (idx: number) => void; - contextMenu?: (evt: any) => void; - sharedCrosshairMove?: (event: any) => void; - renderStart?: () => void; - renderEnd?: () => void; - }; - axis?: { - x?: AxisOption; - y?: AxisOption; - y1?: AxisOption; - }; - grid?: GridOptions; - crosshair?: { - orientation?: CrosshairOrientation; - color?: string; - }; - timeInterval?: { - timeFormat?: TimeFormat; - count?: number; - }; - tickFormat?: { - xAxis?: string; - xTickOrientation?: TickOrientation; - }; - labelFormat?: { - xAxis?: string; - yAxis?: string; - }; - bounds?: { - upper: string; - lower: string; - }; - timeRange?: { - from: number; - to: number; - }; - zoomEvents?: { - mouse?: { - zoom?: { - isActive: boolean; - keyEvent?: KeyEvent; - orientation?: BrushOrientation; - }; - pan?: { - isActive: boolean; - keyEvent?: KeyEvent; - orientation?: PanOrientation; - }; - doubleClick?: { - isActive: boolean; - keyEvent?: KeyEvent; - }; - }; - scroll?: { - zoom?: { - isActive: boolean; - keyEvent?: KeyEvent; - orientation?: PanOrientation; - }; - pan?: { - isActive: boolean; - keyEvent?: KeyEvent; - panStep?: number; - orientation?: ScrollPanOrientation; - direction?: ScrollPanDirection; - }; - }; - }; - renderTicksfromTimestamps?: boolean; - renderLegend?: boolean; -}; -export declare type GridOptions = { - x?: { - enabled?: boolean; - ticksCount?: number; - }; - y?: { - enabled?: boolean; - ticksCount?: number; - }; -}; -export declare type AxisOption = { - isActive?: boolean; - ticksCount?: number; - format?: AxisFormat; - range?: [number, number]; - invert?: boolean; - valueFormatter?: (value: number, i: number) => string; - colorFormatter?: (value: number, i: number) => string; -}; -export declare type AxisRange = [number, number] | undefined; -export declare type VueOptions = Omit; -export declare enum TickOrientation { - VERTICAL = "vertical", - HORIZONTAL = "horizontal", - DIAGONAL = "diagonal" -} -export declare enum TimeFormat { - SECOND = "second", - MINUTE = "minute", - HOUR = "hour", - DAY = "day", - MONTH = "month", - YEAR = "year" -} -export declare enum BrushOrientation { - VERTICAL = "vertical", - HORIZONTAL = "horizontal", - RECTANGLE = "rectangle", - SQUARE = "square" -} -export declare enum PanOrientation { - VERTICAL = "vertical", - HORIZONTAL = "horizontal", - BOTH = "both" -} -export declare enum ScrollPanOrientation { - VERTICAL = "vertical", - HORIZONTAL = "horizontal" -} -export declare enum ScrollPanDirection { - FORWARD = "forward", - BACKWARD = "backward", - BOTH = "both" -} -export declare enum AxisFormat { - TIME = "time", - NUMERIC = "numeric", - STRING = "string", - CUSTOM = "custom" -} -export declare enum CrosshairOrientation { - VERTICAL = "vertical", - HORIZONTAL = "horizontal", - BOTH = "both" -} -export declare type SvgElementAttributes = { - x: number; - y: number; - width: number; - height: number; -}; -export declare enum KeyEvent { - MAIN = "main", - SHIFT = "shift" -} -export declare enum xAxisOrientation { - TOP = "top", - BOTTOM = "bottom", - BOTH = "both" -} -export declare enum yAxisOrientation { - LEFT = "left", - RIGHT = "right", - BOTH = "both" -} -export declare type SvgElParams = { - height: number; - width: number; - xScale: d3.ScaleLinear; - yScale: d3.ScaleLinear; -}; diff --git a/dist/utils.d.ts b/dist/utils.d.ts deleted file mode 100644 index 063343d..0000000 --- a/dist/utils.d.ts +++ /dev/null @@ -1 +0,0 @@ -export declare function uid(): string; diff --git a/src/index.ts b/src/index.ts index 3852570..f55e3f3 100644 --- a/src/index.ts +++ b/src/index.ts @@ -20,12 +20,10 @@ import { ScrollPanOrientation, ScrollPanDirection, AxisOption, - SvgElParams, } from './types'; import { uid } from './utils'; import { palette } from './colors'; -// we import only d3 types here import * as d3 from 'd3'; import defaultsDeep from 'lodash/defaultsDeep'; @@ -44,7 +42,6 @@ const DEFAULT_MARGIN: Margin = { top: 30, right: 20, bottom: 20, left: 30 }; const DEFAULT_TICK_COUNT = 4; const DEFAULT_TICK_SIZE = 2; const MILISECONDS_IN_MINUTE = 60 * 1000; -const DEFAULT_AXIS_RANGE = [0, 1]; const DEFAULT_SCROLL_PAN_STEP = 50; const DEFAULT_OPTIONS: Options = { confidence: 0, @@ -147,8 +144,6 @@ abstract class ChartwerkPod { protected grid: Grid; constructor( - // maybe it's not the best idea - _d3: typeof d3, protected readonly el: HTMLElement, _series: T[] = [], _options: O @@ -160,9 +155,8 @@ abstract class ChartwerkPod { defaultsDeep(options, DEFAULT_OPTIONS); this.options = options; this.series = cloneDeep(_series); - this.d3 = _d3; - this.d3Node = this.d3.select(this.el); + this.d3Node = d3.select(this.el); this.addEventListeners(); this.createSvg(); @@ -315,7 +309,7 @@ abstract class ChartwerkPod { .attr('id', 'x-axis-container') .style('pointer-events', 'none') .call( - this.d3.axisBottom(this.xScale) + d3.axisBottom(this.xScale) .ticks(this.options.axis.x.ticksCount) .tickSize(DEFAULT_TICK_SIZE) .tickFormat(this.getAxisTicksFormatter(this.options.axis.x)) @@ -336,7 +330,7 @@ abstract class ChartwerkPod { .style('pointer-events', 'none') // TODO: number of ticks shouldn't be hardcoded .call( - this.d3.axisLeft(this.yScale) + d3.axisLeft(this.yScale) .ticks(this.options.axis.y.ticksCount) .tickSize(DEFAULT_TICK_SIZE) .tickFormat(this.getAxisTicksFormatter(this.options.axis.y)) @@ -346,7 +340,7 @@ abstract class ChartwerkPod { if(ticks === undefined || ticks[index] === undefined) { return; } - this.d3.select(ticks[index]).attr('color', color); + d3.select(ticks[index]).attr('color', color); }); } @@ -362,7 +356,7 @@ abstract class ChartwerkPod { .style('pointer-events', 'none') // TODO: number of ticks shouldn't be hardcoded .call( - this.d3.axisRight(this.y1Scale) + d3.axisRight(this.y1Scale) .ticks(DEFAULT_TICK_COUNT) .tickSize(DEFAULT_TICK_SIZE) .tickFormat(this.getAxisTicksFormatter(this.options.axis.y1)) @@ -432,17 +426,17 @@ abstract class ChartwerkPod { } switch(this.options.zoomEvents.mouse.zoom.orientation) { case BrushOrientation.VERTICAL: - this.brush = this.d3.brushY(); + this.brush = d3.brushY(); break; case BrushOrientation.HORIZONTAL: - this.brush = this.d3.brushX(); + this.brush = d3.brushX(); break; case BrushOrientation.SQUARE: case BrushOrientation.RECTANGLE: - this.brush = this.d3.brush(); + this.brush = d3.brush(); break; default: - this.brush = this.d3.brushX(); + this.brush = d3.brushX(); } const keyEvent = this.options.zoomEvents.mouse.zoom.keyEvent; this.brush.extent([ @@ -463,9 +457,9 @@ abstract class ChartwerkPod { // TODO: refactor switch(key) { case KeyEvent.MAIN: - return () => !this.d3.event.shiftKey; + return () => !d3.event.shiftKey; case KeyEvent.SHIFT: - return () => this.d3.event.shiftKey; + return () => d3.event.shiftKey; default: throw new Error(`Unknown type of KeyEvent: ${key}`); } @@ -506,7 +500,7 @@ abstract class ChartwerkPod { if(this.options.axis.y1.isActive === true) { this.initScaleY1 = this.y1Scale.copy(); } - this.pan = this.d3.zoom() + this.pan = d3.zoom() .on('zoom', this.onPanning.bind(this)) .on('end', this.onPanningEnd.bind(this)); @@ -626,7 +620,7 @@ abstract class ChartwerkPod { } protected onPanning(): void { - const event = this.d3.event; + const event = d3.event; if(event.sourceEvent === null || event.sourceEvent === undefined) { return; } @@ -708,19 +702,19 @@ abstract class ChartwerkPod { // TODO: refactor, divide between classes rescaleAxisX(transformX: number): void { this.state.transform = { x: transformX }; - const rescaleX = this.d3.event.transform.rescaleX(this.initScaleX); - this.xAxisElement.call(this.d3.axisBottom(this.xScale).scale(rescaleX)); + const rescaleX = d3.event.transform.rescaleX(this.initScaleX); + this.xAxisElement.call(d3.axisBottom(this.xScale).scale(rescaleX)); this.state.xValueRange = [rescaleX.invert(0), rescaleX.invert(this.width)]; } rescaleAxisY(transformY: number): void { this.state.transform = { y: transformY }; - const rescaleY = this.d3.event.transform.rescaleY(this.initScaleY); - this.yAxisElement.call(this.d3.axisLeft(this.yScale).scale(rescaleY)); + const rescaleY = d3.event.transform.rescaleY(this.initScaleY); + this.yAxisElement.call(d3.axisLeft(this.yScale).scale(rescaleY)); this.state.yValueRange = [rescaleY.invert(0), rescaleY.invert(this.height)]; if(this.y1AxisElement) { - const rescaleY1 = this.d3.event.transform.rescaleY(this.initScaleY1); - this.y1AxisElement.call(this.d3.axisLeft(this.y1Scale).scale(rescaleY1)); + const rescaleY1 = d3.event.transform.rescaleY(this.initScaleY1); + this.y1AxisElement.call(d3.axisLeft(this.y1Scale).scale(rescaleY1)); this.state.y1ValueRange = [rescaleY1.invert(0), rescaleY1.invert(this.height)]; // TODO: y1 axis jumps on panning this.y1AxisElement.selectAll('line').attr('x2', 2); @@ -778,7 +772,7 @@ abstract class ChartwerkPod { } protected onBrush(): void { - const selection = this.d3.event.selection; + const selection = d3.event.selection; if(this.options.zoomEvents.mouse.zoom.orientation !== BrushOrientation.SQUARE || selection === null) { return; } @@ -816,15 +810,15 @@ abstract class ChartwerkPod { protected onBrushStart(): void { // TODO: move to state this.isBrushing === true; - const selection = this.d3.event.selection; + const selection = d3.event.selection; if(selection !== null && selection.length > 0) { - this.brushStartSelection = this.d3.event.selection[0]; + this.brushStartSelection = d3.event.selection[0]; } this.onMouseOut(); } protected onBrushEnd(): void { - const extent = this.d3.event.selection; + const extent = d3.event.selection; this.isBrushing === false; if(extent === undefined || extent === null || extent.length < 2) { console.warn('Chartwerk Core: skip brush end (no extent)'); @@ -902,14 +896,14 @@ abstract class ChartwerkPod { // TODO: move to State get absXScale(): d3.ScaleLinear { const domain = [0, Math.abs(this.state.getMaxValueX() - this.state.getMinValueX())]; - return this.d3.scaleLinear() + return d3.scaleLinear() .domain(domain) .range([0, this.width]); } get absYScale(): d3.ScaleLinear { const domain = [0, Math.abs(this.state.getMaxValueY() - this.state.getMinValueY())]; - return this.d3.scaleLinear() + return d3.scaleLinear() .domain(domain) .range([0, this.height]); } @@ -928,23 +922,23 @@ abstract class ChartwerkPod { getd3TimeRangeEvery(count: number): d3.TimeInterval { if(this.options.timeInterval === undefined || this.options.timeInterval.timeFormat === undefined) { - return this.d3.timeMinute.every(count); + return d3.timeMinute.every(count); } switch(this.options.timeInterval.timeFormat) { case TimeFormat.SECOND: - return this.d3.utcSecond.every(count); + return d3.utcSecond.every(count); case TimeFormat.MINUTE: - return this.d3.utcMinute.every(count); + return d3.utcMinute.every(count); case TimeFormat.HOUR: - return this.d3.utcHour.every(count); + return d3.utcHour.every(count); case TimeFormat.DAY: - return this.d3.utcDay.every(count); + return d3.utcDay.every(count); case TimeFormat.MONTH: - return this.d3.utcMonth.every(count); + return d3.utcMonth.every(count); case TimeFormat.YEAR: - return this.d3.utcYear.every(count); + return d3.utcYear.every(count); default: - return this.d3.utcMinute.every(count); + return d3.utcMinute.every(count); } } @@ -965,7 +959,7 @@ abstract class ChartwerkPod { switch(axisOptions.format) { case AxisFormat.TIME: // TODO: customize time format? - return this.d3.timeFormat('%m/%d %H:%M'); + return d3.timeFormat('%m/%d %H:%M'); case AxisFormat.NUMERIC: return (d) => d; case AxisFormat.STRING: @@ -1114,7 +1108,7 @@ abstract class ChartwerkPod { } isOutOfChart(): boolean { - const event = this.d3.mouse(this.chartContainer.node()); + const event = d3.mouse(this.chartContainer.node()); const eventX = event[0]; const eventY = event[1]; if(