-
Notifications
You must be signed in to change notification settings - Fork 4
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'main' into 107-make-sure-vue-portal-destinations-are-un…
…iquely-scoped-to-the-component
- Loading branch information
Showing
6 changed files
with
132 additions
and
74 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,20 @@ | ||
import { getLinePathDefinition } from './line-values'; | ||
|
||
import { data, xScale, yScale } from '@test/unit/mock-data'; | ||
|
||
describe('line-values', () => { | ||
it('should generate a path definition string', () => { | ||
const pathDefinition = getLinePathDefinition( | ||
1, | ||
[data[0].values[0].value, data[0].values[1].value], | ||
xScale, | ||
yScale | ||
); | ||
|
||
// should return a string | ||
expect(typeof pathDefinition).toBe('string'); | ||
|
||
// shouldn't have any NaNs - otherwise something would be wrong | ||
expect(pathDefinition?.includes('NaN')).toBeFalsy(); | ||
}); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,55 @@ | ||
import { line, ScaleBand, ScaleLinear } from 'd3'; | ||
|
||
import { getScaleStep, isBandScale } from '@/utils/helpers'; | ||
import { Scale } from './scales'; | ||
|
||
/** | ||
* Returns the X acessor function for a `ScaleBand`. | ||
* | ||
* @param scale The chart X axis scale. | ||
* @param lineIndex The index of the data point of the line to render. | ||
* @returns The X acessor function to provide to d3 `line` method. | ||
*/ | ||
function getFindBandX(scale: ScaleBand<string | number>, lineIndex: number) { | ||
const xAxisOffset = getScaleStep(scale) / 2; | ||
return (_: unknown, index: number) => | ||
scale(scale.domain()[lineIndex + (index - 1)]) + xAxisOffset; | ||
} | ||
|
||
/** | ||
* Returns the X acessor function for a `ScaleLinear`. | ||
* | ||
* @param scale The chart X axis scale. | ||
* @param lineIndex The index of the data point of the line to render. | ||
* @returns The X acessor function to provide to d3 `line` method. | ||
*/ | ||
function getFindLinearX(scale: ScaleLinear<number, number>, lineIndex: number) { | ||
return (_: unknown, index: number) => scale(lineIndex + (index - 1)); | ||
} | ||
|
||
/** | ||
* Generates the path definition between the point at a provided index (`lineIndex`) | ||
* and the previous point relative to that index. | ||
* | ||
* @param lineIndex The index of the data point of the line to render. | ||
* @param values An array of the previous and current data value | ||
* @param xScale The chart X axis scale. | ||
* @param yScale The chart Y axis scale. | ||
* @returns A path definition string to provide to the `d` attribute of `<path>`. | ||
*/ | ||
export function getLinePathDefinition( | ||
lineIndex: number, | ||
values: Array<number>, | ||
xScale: Scale, | ||
yScale: ScaleLinear<number, number> | ||
) { | ||
const lineFn = line<number>() | ||
.x( | ||
isBandScale(xScale) | ||
? getFindBandX(xScale, lineIndex) | ||
: getFindLinearX(xScale, lineIndex) | ||
) | ||
.y((d) => yScale(d)); | ||
|
||
return lineFn(values); | ||
} |