Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@influxdata/giraffe

Package Overview
Dependencies
Maintainers
21
Versions
179
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@influxdata/giraffe - npm Package Compare versions

Comparing version 0.26.0 to 0.27.0

1

dist/transforms/band.d.ts

@@ -6,2 +6,3 @@ import { BandLayerSpec, Band, ColumnGroupMap, LineData, Table, BandIndexMap } from '../types';

export declare const getBandName: (fillColumnMap: ColumnGroupMap) => string;
export declare const alignMinMaxWithBand: (lineData: LineData, bandIndexMap: BandIndexMap) => LineData;
export declare const bandTransform: (inputTable: Table, xColumnKey: string, yColumnKey: string, fillColKeys: string[], colors: string[]) => BandLayerSpec;

2

package.json
{
"name": "@influxdata/giraffe",
"version": "0.26.0",
"version": "0.27.0",
"main": "dist/index.js",

@@ -5,0 +5,0 @@ "license": "MIT",

@@ -1,4 +0,108 @@

import {getBands} from './band'
import {
alignMinMaxWithBand,
getBandIndexMap,
getBands,
groupLineIndicesIntoBands,
} from './band'
describe('band transform utils', () => {
const columnMap = {
columnKeys: ['result', '_field', '_measurement', 'cpu', 'host'],
mappings: [
{
cpu: 'cpu1',
host: 'localhost',
result: 'max',
_field: 'usage_system',
_measurement: 'cpu',
},
{
cpu: 'cpu0',
host: 'localhost',
result: 'max',
_field: 'usage_system',
_measurement: 'cpu',
},
{
cpu: 'cpu1',
host: 'localhost',
result: 'min',
_field: 'usage_system',
_measurement: 'cpu',
},
{
cpu: 'cpu0',
host: 'localhost',
result: 'min',
_field: 'usage_system',
_measurement: 'cpu',
},
{
cpu: 'cpu0',
host: 'localhost',
result: 'mean',
_field: 'usage_system',
_measurement: 'cpu',
},
{
cpu: 'cpu1',
host: 'localhost',
result: 'mean',
_field: 'usage_system',
_measurement: 'cpu',
},
],
}
describe('creates a map of indices by column type for all columns', () => {
it('creates a map with no indices when the column map is empty', () => {
expect(getBandIndexMap({columnKeys: null, mappings: null})).toEqual({
maxIndices: [],
minIndices: [],
rowIndices: [],
})
expect(
getBandIndexMap({columnKeys: undefined, mappings: undefined})
).toEqual({
maxIndices: [],
minIndices: [],
rowIndices: [],
})
expect(getBandIndexMap({columnKeys: [], mappings: []})).toEqual({
maxIndices: [],
minIndices: [],
rowIndices: [],
})
})
it('creates a map with indices that are in the same position for the same band per column type', () => {
expect(getBandIndexMap(columnMap)).toEqual({
maxIndices: [0, 1],
minIndices: [2, 3],
rowIndices: [5, 4],
})
})
})
describe('creates a map of unique identifiers for the bands and indices of their data', () => {
it('creates no indentifiers when the column map is empty', () => {
expect(
groupLineIndicesIntoBands({columnKeys: null, mappings: null})
).toEqual({})
expect(
groupLineIndicesIntoBands({columnKeys: undefined, mappings: undefined})
).toEqual({})
expect(groupLineIndicesIntoBands({columnKeys: [], mappings: []})).toEqual(
{}
)
})
it('creates identifiers when given a column map', () => {
expect(groupLineIndicesIntoBands(columnMap)).toEqual({
usage_systemcpucpu0localhost: {min: 3, max: 1, row: 4},
usage_systemcpucpu1localhost: {min: 2, max: 0, row: 5},
})
})
})
describe('creates the bands to be rendered', () => {

@@ -10,21 +114,28 @@ it('creates a line with min and max when they are available in the lineData', () => {

{
cpu: 'cpu0',
host: 'localhost',
result: 'min',
_field: 'usage_system',
_measurement: 'cpu',
},
{
cpu: 'cpu0',
host: 'localhost',
},
{
result: 'max',
_field: 'usage_system',
_measurement: 'cpu',
},
{
cpu: 'cpu0',
host: 'localhost',
result: 'mean',
_field: 'usage_system',
_measurement: 'cpu',
},
{
result: 'mean',
cpu: 'cpu1',
host: 'localhost',
result: 'max',
_field: 'usage_system',
_measurement: 'cpu',
cpu: 'cpu0',
host: 'localhost',
},

@@ -110,35 +221,35 @@ ],

{
cpu: 'cpu1',
host: 'localhost',
result: 'min',
_field: 'usage_system',
_measurement: 'cpu',
cpu: 'cpu1',
host: 'localhost',
},
{
cpu: 'cpu0',
host: 'localhost',
result: 'max',
_field: 'usage_system',
_measurement: 'cpu',
},
{
cpu: 'cpu0',
host: 'localhost',
},
{
result: 'mean',
_field: 'usage_system',
_measurement: 'cpu',
cpu: 'cpu0',
host: 'localhost',
},
{
cpu: 'cpu1',
host: 'localhost',
result: 'mean',
_field: 'usage_system',
_measurement: 'cpu',
cpu: 'cpu1',
host: 'localhost',
},
{
cpu: 'cpu2',
host: 'localhost',
result: 'mean',
_field: 'usage_system',
_measurement: 'cpu',
cpu: 'cpu2',
host: 'localhost',
},

@@ -264,2 +375,206 @@ ],

})
describe('aligns min and max columns to have same length as band', () => {
it('returns an empty object when no row indices (no bands) are present', () => {
const lineData = {
0: {
fill: 'rgb(49, 192, 246)',
xs: [16.422140713571192],
ys: [373.73275],
},
1: {
fill: 'rgb(95, 119, 213)',
xs: [16.422140713571192, 32.844281427142384],
ys: [373.73275, 304.66375],
},
2: {
fill: 'rgb(140, 66, 177)',
xs: [16.422140713571192, 32.844281427142384, 49.26642214071357],
ys: [373.73275, 304.66375, 379.4885],
},
}
const bandIndexMap = {
maxIndices: [],
minIndices: [],
rowIndices: [],
}
expect(alignMinMaxWithBand(lineData, bandIndexMap)).toEqual({})
})
it('returns the updated line data with same length rows when one row index is present', () => {
const lineData = {
0: {
fill: 'rgb(49, 192, 246)',
xs: [16.422140713571192],
ys: [373.73275],
},
1: {
fill: 'rgb(95, 119, 213)',
xs: [16.422140713571192, 32.844281427142384],
ys: [373.73275, 304.66375],
},
2: {
fill: 'rgb(140, 66, 177)',
xs: [16.422140713571192, 32.844281427142384, 49.26642214071357],
ys: [373.73275, 304.66375, 379.4885],
},
}
const bandIndexMap = {
maxIndices: [0],
minIndices: [1],
rowIndices: [2],
}
expect(alignMinMaxWithBand(lineData, bandIndexMap)).toEqual({
0: {
fill: 'rgb(49, 192, 246)',
xs: [16.422140713571192, 32.844281427142384, 49.26642214071357],
ys: [373.73275, 304.66375, 379.4885],
},
1: {
fill: 'rgb(95, 119, 213)',
xs: [16.422140713571192, 32.844281427142384, 49.26642214071357],
ys: [373.73275, 304.66375, 379.4885],
},
2: {
fill: 'rgb(140, 66, 177)',
xs: [16.422140713571192, 32.844281427142384, 49.26642214071357],
ys: [373.73275, 304.66375, 379.4885],
},
})
lineData[2].xs.unshift(0)
lineData[2].ys.unshift(null)
expect(alignMinMaxWithBand(lineData, bandIndexMap)).toEqual({
0: {
fill: 'rgb(49, 192, 246)',
xs: [0, 16.422140713571192, 32.844281427142384, 49.26642214071357],
ys: [null, 373.73275, 304.66375, 379.4885],
},
1: {
fill: 'rgb(95, 119, 213)',
xs: [0, 16.422140713571192, 32.844281427142384, 49.26642214071357],
ys: [null, 373.73275, 304.66375, 379.4885],
},
2: {
fill: 'rgb(140, 66, 177)',
xs: [0, 16.422140713571192, 32.844281427142384, 49.26642214071357],
ys: [null, 373.73275, 304.66375, 379.4885],
},
})
})
it('returns the updated line data with same length rows when multiple row indices are present', () => {
const lineData = {
0: {
fill: 'rgb(49, 192, 246)',
xs: [16.422140713571192],
ys: [373.73275],
},
1: {
fill: 'red',
xs: [1, 3],
ys: [20, 55],
},
2: {
fill: 'rgb(95, 119, 213)',
xs: [16.422140713571192, 32.844281427142384],
ys: [373.73275, 304.66375],
},
3: {
fill: 'green',
xs: [3],
ys: [25],
},
4: {
fill: 'blue',
xs: [1, 3, 5, 7, 9],
ys: [20, 40, 60, 80, 100],
},
5: {
fill: 'rgb(140, 66, 177)',
xs: [16.422140713571192, 32.844281427142384, 49.26642214071357],
ys: [373.73275, 304.66375, 379.4885],
},
}
const bandIndexMap = {
maxIndices: [0, 1],
minIndices: [2, 3],
rowIndices: [5, 4],
}
expect(alignMinMaxWithBand(lineData, bandIndexMap)).toEqual({
0: {
fill: 'rgb(49, 192, 246)',
xs: [16.422140713571192, 32.844281427142384, 49.26642214071357],
ys: [373.73275, 304.66375, 379.4885],
},
1: {
fill: 'red',
xs: [1, 3, 5, 7, 9],
ys: [20, 55, 60, 80, 100],
},
2: {
fill: 'rgb(95, 119, 213)',
xs: [16.422140713571192, 32.844281427142384, 49.26642214071357],
ys: [373.73275, 304.66375, 379.4885],
},
3: {
fill: 'green',
xs: [1, 3, 5, 7, 9],
ys: [20, 25, 60, 80, 100],
},
4: {
fill: 'blue',
xs: [1, 3, 5, 7, 9],
ys: [20, 40, 60, 80, 100],
},
5: {
fill: 'rgb(140, 66, 177)',
xs: [16.422140713571192, 32.844281427142384, 49.26642214071357],
ys: [373.73275, 304.66375, 379.4885],
},
})
lineData[4].xs.unshift(0)
lineData[4].ys.unshift(null)
lineData[5].xs.push(50)
lineData[5].ys.push(null)
expect(alignMinMaxWithBand(lineData, bandIndexMap)).toEqual({
0: {
fill: 'rgb(49, 192, 246)',
xs: [16.422140713571192, 32.844281427142384, 49.26642214071357, 50],
ys: [373.73275, 304.66375, 379.4885, null],
},
1: {
fill: 'red',
xs: [0, 1, 3, 5, 7, 9],
ys: [null, 20, 55, 60, 80, 100],
},
2: {
fill: 'rgb(95, 119, 213)',
xs: [16.422140713571192, 32.844281427142384, 49.26642214071357, 50],
ys: [373.73275, 304.66375, 379.4885, null],
},
3: {
fill: 'green',
xs: [0, 1, 3, 5, 7, 9],
ys: [null, 20, 25, 60, 80, 100],
},
4: {
fill: 'blue',
xs: [0, 1, 3, 5, 7, 9],
ys: [null, 20, 40, 60, 80, 100],
},
5: {
fill: 'rgb(140, 66, 177)',
xs: [16.422140713571192, 32.844281427142384, 49.26642214071357, 50],
ys: [373.73275, 304.66375, 379.4885, null],
},
})
})
})
})

@@ -10,2 +10,3 @@ import {

import {FILL, RESULT, MAX, MIN} from '../constants/columnKeys'
import {isDefined} from '../utils/isDefined'
import {createGroupIDColumn, getNominalColorScale} from './'

@@ -73,11 +74,9 @@

if (Array.isArray(fillColumnMap.mappings)) {
fillColumnMap.mappings.forEach((line, index) => {
if (line[RESULT] === MAX) {
bandIndices.maxIndices.push(index)
} else if (line[RESULT] === MIN) {
bandIndices.minIndices.push(index)
} else {
bandIndices.rowIndices.push(index)
}
const bands = Object.values(groupLineIndicesIntoBands(fillColumnMap))
if (Array.isArray(bands)) {
bands.forEach(band => {
bandIndices.rowIndices.push(isDefined(band.row) ? band.row : null)
bandIndices.minIndices.push(isDefined(band.min) ? band.min : null)
bandIndices.maxIndices.push(isDefined(band.max) ? band.max : null)
})

@@ -131,2 +130,241 @@ }

export const alignMinMaxWithBand = (
lineData: LineData,
bandIndexMap: BandIndexMap
): LineData => {
const {rowIndices, maxIndices, minIndices} = bandIndexMap
const alignedData = {}
let bandXs = []
let bandYs = []
let maxXs = []
let maxYs = []
let minXs = []
let minYs = []
for (let i = 0; i < rowIndices.length; i += 1) {
const bandId = rowIndices[i]
const maxId = maxIndices[i]
const minId = minIndices[i]
if (lineData[maxId]) {
alignedData[maxId] = {
fill: lineData[maxId].fill,
xs: [],
ys: [],
}
maxXs = lineData[maxId].xs
maxYs = lineData[maxId].ys
}
if (lineData[minId]) {
alignedData[minId] = {
fill: lineData[minId].fill,
xs: [],
ys: [],
}
minXs = lineData[minId].xs
minYs = lineData[minId].ys
}
if (lineData[bandId]) {
alignedData[bandId] = {
fill: lineData[bandId].fill,
xs: [],
ys: [],
}
bandXs = lineData[bandId].xs
bandYs = lineData[bandId].ys
let bandIterator = 0
let maxIterator = 0
let minIterator = 0
while (
bandIterator < bandXs.length ||
maxIterator < maxXs.length ||
minIterator < minXs.length
) {
const bandTime = bandXs[bandIterator]
const bandValue = bandYs[bandIterator]
const maxTime = maxXs[maxIterator]
const maxValue = maxYs[maxIterator]
const minTime = minXs[minIterator]
const minValue = minYs[minIterator]
// 1. All three are equal
if (bandTime === maxTime && bandTime === minTime) {
if (isDefined(bandTime)) {
alignedData[bandId].xs.push(bandTime)
alignedData[bandId].ys.push(bandValue)
bandIterator += 1
}
if (isDefined(maxTime)) {
alignedData[maxId].xs.push(maxTime)
alignedData[maxId].ys.push(maxValue)
maxIterator += 1
}
if (isDefined(minTime)) {
alignedData[minId].xs.push(minTime)
alignedData[minId].ys.push(minValue)
minIterator += 1
}
}
// 2. Min is not equal to the other two
else if (bandTime === maxTime) {
if (bandTime > minTime || !isDefined(bandTime)) {
alignedData[bandId].xs.push(minTime)
alignedData[bandId].ys.push(minValue)
alignedData[maxId].xs.push(minTime)
alignedData[maxId].ys.push(minValue)
alignedData[minId].xs.push(minTime)
alignedData[minId].ys.push(minValue)
minIterator += 1
} else if (bandTime < minTime || !isDefined(minTime)) {
alignedData[bandId].xs.push(bandTime)
alignedData[bandId].ys.push(bandValue)
alignedData[maxId].xs.push(maxTime)
alignedData[maxId].ys.push(maxValue)
alignedData[minId].xs.push(bandTime)
alignedData[minId].ys.push(bandValue)
bandIterator += 1
maxIterator += 1
}
}
// 3. Max is not equal to the other two
else if (bandTime === minTime) {
if (bandTime > maxTime || !isDefined(bandTime)) {
alignedData[bandId].xs.push(maxTime)
alignedData[bandId].ys.push(maxValue)
alignedData[minId].xs.push(maxTime)
alignedData[minId].ys.push(maxValue)
alignedData[maxId].xs.push(maxTime)
alignedData[maxId].ys.push(maxValue)
maxIterator += 1
} else if (bandTime < maxTime || !isDefined(maxTime)) {
alignedData[bandId].xs.push(bandTime)
alignedData[bandId].ys.push(bandValue)
alignedData[maxId].xs.push(bandTime)
alignedData[maxId].ys.push(bandValue)
alignedData[minId].xs.push(minTime)
alignedData[minId].ys.push(minValue)
bandIterator += 1
minIterator += 1
}
}
// 4. Band is not equal to the other two
else if (maxTime === minTime) {
if (maxTime > bandTime || !isDefined(maxTime)) {
alignedData[bandId].xs.push(bandTime)
alignedData[bandId].ys.push(bandValue)
alignedData[maxId].xs.push(bandTime)
alignedData[maxId].ys.push(bandValue)
alignedData[minId].xs.push(bandTime)
alignedData[minId].ys.push(bandValue)
bandIterator += 1
} else if (maxTime < bandTime || !isDefined(bandTime)) {
alignedData[bandId].xs.push(maxTime)
alignedData[bandId].ys.push(maxValue)
alignedData[maxId].xs.push(maxTime)
alignedData[maxId].ys.push(maxValue)
alignedData[minId].xs.push(minTime)
alignedData[minId].ys.push(minValue)
maxIterator += 1
minIterator += 1
}
}
// 5. They are all different
else {
if (!isDefined(bandTime)) {
if (maxTime > minTime) {
alignedData[bandId].xs.push(minTime)
alignedData[bandId].ys.push(minValue)
alignedData[maxId].xs.push(minTime)
alignedData[maxId].ys.push(minValue)
alignedData[minId].xs.push(minTime)
alignedData[minId].ys.push(minValue)
minIterator += 1
} else {
alignedData[bandId].xs.push(maxTime)
alignedData[bandId].ys.push(maxValue)
alignedData[maxId].xs.push(maxTime)
alignedData[maxId].ys.push(maxValue)
alignedData[minId].xs.push(maxTime)
alignedData[minId].ys.push(maxValue)
maxIterator += 1
}
} else if (!isDefined(maxTime)) {
if (bandTime > minTime) {
alignedData[bandId].xs.push(minTime)
alignedData[bandId].ys.push(minValue)
alignedData[maxId].xs.push(minTime)
alignedData[maxId].ys.push(minValue)
alignedData[minId].xs.push(minTime)
alignedData[minId].ys.push(minValue)
minIterator += 1
} else {
alignedData[bandId].xs.push(bandTime)
alignedData[bandId].ys.push(bandValue)
alignedData[maxId].xs.push(bandTime)
alignedData[maxId].ys.push(bandValue)
alignedData[minId].xs.push(bandTime)
alignedData[minId].ys.push(bandValue)
bandIterator += 1
}
} else if (!isDefined(minTime)) {
if (bandTime > maxTime) {
alignedData[bandId].xs.push(maxTime)
alignedData[bandId].ys.push(maxValue)
alignedData[maxId].xs.push(maxTime)
alignedData[maxId].ys.push(maxValue)
alignedData[minId].xs.push(maxTime)
alignedData[minId].ys.push(maxValue)
maxIterator += 1
} else {
alignedData[bandId].xs.push(bandTime)
alignedData[bandId].ys.push(bandValue)
alignedData[maxId].xs.push(bandTime)
alignedData[maxId].ys.push(bandValue)
alignedData[minId].xs.push(bandTime)
alignedData[minId].ys.push(bandValue)
bandIterator += 1
}
} else {
const lowest = Math.min(bandTime, maxTime, minTime)
if (lowest === minTime) {
alignedData[bandId].xs.push(minTime)
alignedData[bandId].ys.push(minValue)
alignedData[maxId].xs.push(minTime)
alignedData[maxId].ys.push(minValue)
alignedData[minId].xs.push(minTime)
alignedData[minId].ys.push(minValue)
minIterator += 1
} else if (lowest === maxTime) {
alignedData[bandId].xs.push(maxTime)
alignedData[bandId].ys.push(maxValue)
alignedData[maxId].xs.push(maxTime)
alignedData[maxId].ys.push(maxValue)
alignedData[minId].xs.push(maxTime)
alignedData[minId].ys.push(maxValue)
maxIterator += 1
} else {
alignedData[bandId].xs.push(bandTime)
alignedData[bandId].ys.push(bandValue)
alignedData[maxId].xs.push(bandTime)
alignedData[maxId].ys.push(bandValue)
alignedData[minId].xs.push(bandTime)
alignedData[minId].ys.push(bandValue)
bandIterator += 1
}
}
}
}
}
}
return alignedData
}
export const bandTransform = (

@@ -133,0 +371,0 @@ inputTable: Table,

@@ -39,5 +39,6 @@ import {line, curveLinear, area} from 'd3-shape'

const minAreaGenerator = area<number>()
.y0((i: any) => band.ys[i])
.y1((i: any) => ys_min[i])
.x((i: any) => xs_min[i])
.y1((i: any) => band.ys[i])
.y0((i: any) => ys_min[i])
.x1((i: any) => band.xs[i])
.x0((i: any) => xs_min[i])
.context(context)

@@ -57,5 +58,6 @@ .defined((i: any) => isDefined(xs_min[i]) && isDefined(ys_min[i]))

const maxAreaGenerator = area<number>()
.y0((i: any) => ys_max[i])
.y1((i: any) => band.ys[i])
.x((i: any) => xs_max[i])
.y1((i: any) => ys_max[i])
.y0((i: any) => band.ys[i])
.x1((i: any) => xs_max[i])
.x0((i: any) => band.xs[i])
.context(context)

@@ -62,0 +64,0 @@ .defined((i: any) => isDefined(xs_max[i]) && isDefined(ys_max[i]))

import {NumericColumnData, BandIndexMap, LineData} from '../types'
import {isDefined} from './isDefined'

@@ -49,11 +50,11 @@ interface MinMaxOfBands {

}
if (typeof band.max === 'number') {
if (isDefined(band.max)) {
minMaxOfBands[band.row].maxCol = band.max
if (typeof hoverColumnToIndexMap[band.max] === 'number') {
if (isDefined(hoverColumnToIndexMap[band.max])) {
minMaxOfBands[band.row].maxIndex = hoverColumnToIndexMap[band.max]
}
}
if (typeof band.min === 'number') {
if (isDefined(band.min)) {
minMaxOfBands[band.row].minCol = band.min
if (typeof hoverColumnToIndexMap[band.min] === 'number') {
if (isDefined(hoverColumnToIndexMap[band.min])) {
minMaxOfBands[band.row].minIndex = hoverColumnToIndexMap[band.min]

@@ -60,0 +61,0 @@ }

Sorry, the diff of this file is too big to display

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc