minor bugs fix (#851)

* fix: get nearest points listed in tooltip of scalar page by selected x-axis

* fix: humanize relative time display in tooltip of scalar chart

* fix: fix y axis range error in scalar chart (fix #765)

frontend/packages/core/src/components/Audio.tsx

@@ -48,7 +48,7 @@ const Container = styled.div`
         cursor: pointer;
         ${transitionProps('color')}
 
-        &.volumn {
+        &.volume {
             font-size: ${rem(20)};
             ${size(rem(20), rem(20))}
         }
@@ -80,7 +80,7 @@ const Container = styled.div`
     }
 `;
 
-const VolumnSlider = styled(Slider)`
+const VolumeSlider = styled(Slider)`
     margin: ${rem(15)} ${rem(18)};
     width: ${rem(4)};
     height: ${rem(100)};
@@ -170,7 +170,7 @@ const Audio: FunctionComponent<AudioProps & WithStyled> = ({
     const [duration, setDuration] = useState('00:00');
     const [decoding, setDecoding] = useState(false);
     const [playing, setPlaying] = useState(false);
-    const [volumn, setVolumn] = useState(100);
+    const [volume, setVolume] = useState(100);
     const [playAfterSeek, setPlayAfterSeek] = useState(false);
 
     const play = useCallback(() => player.current?.play(), []);
@@ -199,7 +199,7 @@ const Audio: FunctionComponent<AudioProps & WithStyled> = ({
     const toggleMute = useCallback(() => {
         if (player.current) {
             player.current.toggleMute();
-            setVolumn(player.current.volumn);
+            setVolume(player.current.volume);
         }
     }, []);
 
@@ -228,9 +228,9 @@ const Audio: FunctionComponent<AudioProps & WithStyled> = ({
 
     useEffect(() => {
         if (player.current) {
-            player.current.volumn = volumn;
+            player.current.volume = volume;
         }
-    }, [volumn]);
+    }, [volume]);
 
     useEffect(() => {
         let p: AudioPlayer | null = null;
@@ -269,15 +269,15 @@ const Audio: FunctionComponent<AudioProps & WithStyled> = ({
         };
     }, [data, startTimer, stopTimer, onLoading, onLoad, audioContext]);
 
-    const volumnIcon = useMemo(() => {
-        if (volumn === 0) {
+    const volumeIcon = useMemo(() => {
+        if (volume === 0) {
             return 'mute';
         }
-        if (volumn <= 50) {
-            return 'volumn-low';
+        if (volume <= 50) {
+            return 'volume-low';
         }
-        return 'volumn';
-    }, [volumn]);
+        return 'volume';
+    }, [volume]);
 
     if (loading) {
         return <SyncLoader color={primaryColor} size="15px" />;
@@ -313,18 +313,18 @@ const Audio: FunctionComponent<AudioProps & WithStyled> = ({
                 interactive
                 hideOnClick={false}
                 content={
-                    <VolumnSlider
-                        value={volumn}
+                    <VolumeSlider
+                        value={volume}
                         min={0}
                         max={100}
                         step={1}
-                        onChange={setVolumn}
+                        onChange={setVolume}
                         orientation="vertical"
                     />
                 }
             >
-                <a className="control volumn" onClick={toggleMute}>
-                    <Icon type={volumnIcon} />
+                <a className="control volume" onClick={toggleMute}>
+                    <Icon type={volumeIcon} />
                 </a>
             </Tippy>
         </Container>

frontend/packages/core/src/components/ScalarPage/ScalarChart.tsx

@@ -201,7 +201,8 @@ const ScalarChart: FunctionComponent<ScalarChartProps> = ({
     const formatter = useCallback(
         (params: EChartOption.Tooltip.Format | EChartOption.Tooltip.Format[]) => {
             const series: Dataset[number] = Array.isArray(params) ? params[0].data : params.data;
-            const points = nearestPoint(smoothedDatasets ?? [], runs, series[1]).map((point, index) => ({
+            const idx = xAxisMap[xAxis];
+            const points = nearestPoint(smoothedDatasets ?? [], runs, idx, series[idx]).map((point, index) => ({
                 ...point,
                 ...datasetRanges?.[index]
             }));
@@ -212,7 +213,7 @@ const ScalarChart: FunctionComponent<ScalarChartProps> = ({
                 <TooltipTable run={t('common:runs')} runs={sorted.map(i => i.run)} columns={columns} data={data} />
             );
         },
-        [smoothedDatasets, datasetRanges, runs, sortingMethod, maxStepLength, t, i18n]
+        [smoothedDatasets, datasetRanges, runs, sortingMethod, xAxis, maxStepLength, t, i18n]
     );
 
     const options = useMemo(

frontend/packages/core/src/resource/graph/types.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
 export type Property = {
     name?: string;
     value: string;

frontend/packages/core/src/resource/high-dimensional/index.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
 import type {Point} from './types';
 
 export type {Dimension, Reduction, Point} from './types';

frontend/packages/core/src/resource/high-dimensional/types.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
 export type Dimension = '2d' | '3d';
 export type Reduction = 'pca' | 'tsne';
 

frontend/packages/core/src/resource/histogram/chart.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
 import type {EChartOption, VisualMap} from 'echarts';
 
 import type {Modes} from './types';

frontend/packages/core/src/resource/histogram/data.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
 import type {HistogramData, OffsetData, OffsetDataItem, OverlayData, OverlayDataItem} from './types';
 
 import {Modes} from './types';

frontend/packages/core/src/resource/histogram/index.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
 import {Modes} from './types';
 
 export const modes = [Modes.Offset, Modes.Overlay] as const;

frontend/packages/core/src/resource/histogram/types.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
 export enum Modes {
     Offset = 'offset',
     Overlay = 'overlay'

frontend/packages/core/src/resource/pr-curve/chart.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
 export const options = {
     legend: {
         data: []

frontend/packages/core/src/resource/pr-curve/data.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
 export const nearestPoint = (data: number[][][], recall: number): number[][][] => {
     return data.map(series => {
         let delta = Number.POSITIVE_INFINITY;

frontend/packages/core/src/resource/pr-curve/index.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
 export type {PRCurveData, Run, StepInfo, Tag} from './types';
 export {TimeType} from './types';
 export * from './chart';

frontend/packages/core/src/resource/pr-curve/types.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
 import {Run as BaseRun, Tag as BaseTag, TimeMode} from '~/types';
 
 export {TimeMode as TimeType};

frontend/packages/core/src/resource/scalar/chart.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+// cSpell:words maxs coord
+
 import type {Dataset, Range, TooltipData, XAxis} from './types';
 
 import type I18n from 'i18next';
 import type {Run} from '~/types';
 import {format} from 'd3-format';
 import {formatTime} from '~/utils';
+import moment from 'moment';
 import {xAxisMap} from './index';
 
 const valueFormatter = format('.5');
 
+const humanizeDuration = (ms: number) => {
+    const time = moment.duration(ms);
+    const hour = time.hours();
+    if (hour) {
+        time.subtract(hour, 'hour');
+    }
+    const minute = time.minutes();
+    if (minute) {
+        time.subtract(minute, 'minute');
+    }
+    const second = time.asSeconds();
+    let str = Math.floor(second) + 's';
+    if (hour) {
+        str = `${hour}h${minute}m${str}`;
+    } else if (minute) {
+        str = `${minute}m${str}`;
+    }
+    return str;
+};
+
 export const options = {
     legend: {
         data: []
@@ -35,7 +74,7 @@ export const chartData = ({
             // smoothed data:
             // [0] wall time
             // [1] step
-            // [2] orginal value
+            // [2] original value
             // [3] smoothed value
             // [4] relative
             const name = runs[i].label;
@@ -144,7 +183,7 @@ export const tooltip = (data: TooltipData[], stepLength: number, i18n: typeof I1
             valueFormatter(min ?? Number.NaN),
             valueFormatter(max ?? Number.NaN),
             formatTime(item[0], i18n.language),
-            Math.floor(item[4] * 60 * 60) + 's'
+            humanizeDuration(item[4])
         ])
     };
 };

frontend/packages/core/src/resource/scalar/data.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+// cSpell:words quantile accum debias exponentiated
+
 import type {Dataset, ScalarDataset} from './types';
 
 import BigNumber from 'bignumber.js';
@@ -21,8 +39,8 @@ export const transform = ({datasets, smoothing}: {datasets: ScalarDataset[]; smo
             if (i === 0) {
                 startValue = millisecond;
             }
-            // relative time, millisecond to hours.
-            d[4] = Math.floor(millisecond - startValue) / (60 * 60 * 1000);
+            // relative time in millisecond.
+            d[4] = Math.floor(millisecond - startValue);
             if (!nextVal.isFinite()) {
                 d[3] = nextVal.toNumber();
             } else {
@@ -65,12 +83,12 @@ export const range = ({datasets}: {datasets: Dataset[]}) => {
 export const axisRange = ({datasets, outlier}: {datasets: Dataset[]; outlier: boolean}) => {
     const ranges = compact(
         datasets?.map(dataset => {
-            if (dataset.length == 0) {
-                return;
+            if (dataset.length === 0) {
+                return void 0;
             }
             const values = dataset.map(v => v[2]);
             if (!outlier) {
-                // Get the orgin data range.
+                // Get the origin data range.
                 return {
                     min: Math.min(...values) ?? 0,
                     max: Math.max(...values) ?? 0
@@ -97,32 +115,23 @@ export const axisRange = ({datasets, outlier}: {datasets: Dataset[]; outlier: bo
     }
 };
 
-export const nearestPoint = (data: Dataset[], runs: Run[], step: number) =>
-    data.map((series, index) => {
-        let nearestItem;
-        if (step === 0) {
-            nearestItem = series[0];
-        } else {
-            for (let i = 0; i < series.length; i++) {
-                const item = series[i];
-                if (item[1] === step) {
-                    nearestItem = item;
-                    break;
-                }
-                if (item[1] > step) {
-                    nearestItem = series[i - 1 >= 0 ? i - 1 : 0];
-                    break;
-                }
-                if (!nearestItem) {
-                    nearestItem = series[series.length - 1];
-                }
+export const nearestPoint = (data: Dataset[], runs: Run[], idx: number, value: number) => {
+    const result: {run: Run; item: Dataset[number]}[] = [];
+    data.forEach((series, index) => {
+        const run = runs[index];
+        let d = Number.POSITIVE_INFINITY;
+        let dv = value;
+        for (let i = 0; i < series.length; i++) {
+            const dd = Math.abs(series[i][idx] - value);
+            if (d > dd) {
+                d = dd;
+                dv = series[i][idx];
             }
         }
-        return {
-            run: runs[index],
-            item: nearestItem || [0, 0, 0, 0, 0]
-        };
+        result.push(...series.filter(s => s[idx] === dv).map(item => ({run, item})));
     });
+    return result;
+};
 
 export const parseSmoothing = (value: unknown) => {
     const parsedValue = Number.parseFloat(String(value));

frontend/packages/core/src/resource/scalar/index.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
 import {SortingMethod as SM, XAxis} from './types';
 
 import type {TooltipData} from './types';
@@ -14,7 +30,7 @@ export const sortingMethodMap: Record<SM, (points: TooltipData[], data: number[]
     [SM.Default]: (points: TooltipData[]) => points,
     [SM.Descending]: (points: TooltipData[]) => sortBy(points, point => point.item[3]).reverse(),
     [SM.Ascending]: (points: TooltipData[]) => sortBy(points, point => point.item[3]),
-    // Compare other ponts width the trigger point, caculate the nearest sort.
+    // Compare other points width the trigger point, calculate the nearest sort.
     [SM.Nearest]: (points: TooltipData[], data: number[]) => sortBy(points, point => point.item[3] - data[2])
 } as const;
 

frontend/packages/core/src/resource/scalar/types.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
 import {Run, TimeMode} from '~/types';
 
 type Value = number;

frontend/packages/core/src/types/index.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
 export interface TagsData {
     runs: string[];
     tags: string[][];

frontend/packages/core/src/utils/audio.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
 interface AudioPlayerOptions {
     context?: AudioContext;
-    volumn?: number;
+    volume?: number;
     onplay?: () => void;
     onstop?: () => void;
 }
@@ -17,7 +33,7 @@ export class AudioPlayer {
     private stopAt = 0;
     private offset = 0;
 
-    private toggleVolumn = 100;
+    private toggleVolume = 100;
 
     public playing = false;
 
@@ -44,10 +60,10 @@ export class AudioPlayer {
         return this.decodedSampleRate;
     }
 
-    get volumn() {
+    get volume() {
         return this.gain.gain.value * 100;
     }
-    set volumn(value: number) {
+    set volume(value: number) {
         if (value > 100) {
             value = 100;
         } else if (value < 0) {
@@ -59,7 +75,7 @@ export class AudioPlayer {
     constructor(options?: AudioPlayerOptions) {
         this.options = {
             context: options?.context ?? new AudioContext(),
-            volumn: 100,
+            volume: 100,
             onplay: () => void 0,
             onstop: () => void 0,
             ...options
@@ -67,7 +83,7 @@ export class AudioPlayer {
         this.contextFromOptions = !!options?.context;
         this.context = this.options.context;
         this.gain = this.context.createGain();
-        this.volumn = this.options.volumn;
+        this.volume = this.options.volume;
     }
 
     private reset() {
@@ -208,11 +224,11 @@ export class AudioPlayer {
     }
 
     toggleMute() {
-        if (this.volumn === 0) {
-            this.volumn = this.toggleVolumn || 100;
+        if (this.volume === 0) {
+            this.volume = this.toggleVolume || 100;
         } else {
-            this.toggleVolumn = this.volumn;
-            this.volumn = 0;
+            this.toggleVolume = this.volume;
+            this.volume = 0;
         }
     }
 

frontend/packages/core/src/utils/chart.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
 import {colors} from '~/utils/theme';
 import {format} from 'd3-format';
 

frontend/packages/core/src/utils/event.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
 import EventEmitter from 'eventemitter3';
 
 export default new EventEmitter();

frontend/packages/core/src/utils/fetch.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
 import type {TFunction} from 'i18next';
 import i18next from 'i18next';
 import queryString from 'query-string';

frontend/packages/core/src/utils/i18n.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
 import Fetch from 'i18next-fetch-backend';
 import LanguageDetector from 'i18next-browser-languagedetector';
 import i18n from 'i18next';

frontend/packages/core/src/utils/image.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
 export function dataURL2Blob(base64: string): Blob {
     const parts = base64.split(';base64,');
     const contentType = parts[0].split(':')[1];

frontend/packages/core/src/utils/index.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+// cSpell:words quantile
+
 import BigNumber from 'bignumber.js';
 import moment from 'moment';
 

frontend/packages/core/src/utils/style.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+// cSpell:words pxval mixins grayscale
+
 import 'tippy.js/dist/tippy.css';
 import 'tippy.js/animations/shift-away-subtle.css';
 import 'react-toastify/dist/ReactToastify.css';

frontend/packages/core/src/utils/theme.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
 import {darken, lighten} from 'polished';
 
 import {css} from 'styled-components';

frontend/packages/core/src/utils/wasm.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
 import * as funcs from '@visualdl/wasm';
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any

frontend/packages/wasm/src/scalar.rs

@@ -2,7 +2,7 @@
 pub struct Dataset(f64, i64, f64);
 
 #[derive(Serialize, Deserialize)]
-pub struct Smoothed(i64, i64, f64, f64, f64);
+pub struct Smoothed(i64, i64, f64, f64, i64);
 
 #[derive(Serialize, Deserialize)]
 pub struct Range {
@@ -44,7 +44,7 @@ pub fn transform(datasets: &Vec<Vec<Dataset>>, smoothing: f64) -> Vec<Vec<Smooth
         let mut num_accum: i32 = 0;
         let mut start_value: i64 = 0;
         for (i, d) in dataset.iter().enumerate() {
-            let mut r: Smoothed = Smoothed(0, d.1, d.2, 0.0, 0.0);
+            let mut r: Smoothed = Smoothed(0, d.1, d.2, 0.0, 0);
             let next_val: f64 = d.2;
             // second to millisecond.
             let millisecond: i64 = d.0.floor() as i64;
@@ -52,8 +52,8 @@ pub fn transform(datasets: &Vec<Vec<Dataset>>, smoothing: f64) -> Vec<Vec<Smooth
             if i == 0 {
                 start_value = millisecond;
             }
-            // Relative time, millisecond to hours.
-            r.4 = ((millisecond - start_value) as f64) / (60 * 60 * 1000) as f64;
+            // Relative time in millisecond.
+            r.4 = millisecond - start_value;
             if next_val.is_infinite() {
                 r.3 = next_val;
             } else {
@@ -122,7 +122,7 @@ pub fn axis_range(datasets: &Vec<Vec<Smoothed>>, outlier: bool) -> Range {
     if ranges.len() != 0 {
         min = ranges
             .iter()
-            .min_by(|x, y| x.min.partial_cmp(&y.max).unwrap())
+            .min_by(|x, y| x.min.partial_cmp(&y.min).unwrap())
             .unwrap()
             .min;
         max = ranges