gl-vis/regl-splom

Matrix of scatter2d plots

regl-splom's Issues

I found one regl.buffer `data: null`

here:

https://github.com/dy/regl-splom/blob/70d118e451d147eb4892a8eec2c56fe572dd581b/index.js#L132

which is likely to break in Safari.

destroy method is broken

const regl = require('regl')({ extensions: 'oes_element_index_uint' })
const createMatrix = require('./')


// create splom instance
let splom = createMatrix(regl)

splom.update({
  data: [
    [1, 2, 3],
    [4, 6, 8]
  ],
  ranges: [
    [0, 10],
    [0, 10]
  ]
})

splom.draw()

setTimeout(() => {
  splom.destroy()
}, 2000)

spits out

cc @dfcreative

Does not work with typed array data columns

Consider:

const regl = require('regl')({ extensions: 'oes_element_index_uint' })
const createMatrix = require('./')

let splom = createMatrix(regl)

splom.update({
  data: [
    new Float32Array([1, 2, 3]),
    new Float32Array([4, 6, 8]),
    new Float32Array([1, 5, 9])
  ],
  ranges: [
    [0, 10],
    [0, 10],
    [0, 10]
  ],
  domain: [
    [0, 0, 0.3, 0.3],
    [0.35, 0.35, 0.65, 0.65],
    [0.7, 0.7, 1, 1] 
  ],
  color: ['red', 'green', 'blue'],
  size: [20, 10, 30]
})

splom.draw()

this gives:

and a blank screen.

---

Is this a known limitation of this implementation? That is, should we try to convert typed array to plain arrays in plotly.js? Or would there be an easy way to make regl-splom accept typed arrays?

destroy is broken again

from any splom mock off plotly/plotly.js#2505 then calling Plotly.purge(gd) (which calls splom.destroy) gives:

1.0 To do

• per-trace/per-variable range
• per-trace/per-variable domain
• pan-zoom for row/column only
• optimize only-range/domain update (exclude unnecessary options) for fast panning
• multiple viewports domains
• selection/hover indexed redraw
• binary tree clustering for 1e6 points
• snap points checkbox
• grid layout switch
• react-toolbox for demo

Generated (x,y) positions are off

@dfcreative

From

const regl = require('regl')({ extensions: 'oes_element_index_uint' })
const createMatrix = require('./')


// create splom instance
let splom = createMatrix(regl)

splom.update({
  data: [
    [1, 2, 3],
    [4, 6, 8]
  ],
  ranges: [
    [0, 10],
    [0, 10]
  ]
})

splom.draw()

I get:

where the the top-left panel which is supposed to plot x=[1,2,3] vs y=[4,6,8] is plotting instead x=[4,6,8] vs y=[1,2,3] and similarly for the bottom-right panel.

No 'marker' option?

SDF markers (as in regl-scatter2d) don't seem to be supported.

Remove left-pad dependency

I don't see left-pad being used. This dependency makes it awkward to use plotly.js due to a weird licensing.

The left-pad license was updated to MIT in the repo, but the repo has been archived before it was even published to npm.

How to set domains and ranges for no-diagonal + no-upper or no-lower sploms?

Consider:

const regl = require('regl')({ extensions: 'oes_element_index_uint' })
const createMatrix = require('./')

let splom = createMatrix(regl)

splom.update({
  data: [
    [1, 2, 3],
    [4, 6, 8],
    [1, 5, 9]
  ],
  ranges: [
    [0, 10],
    [0, 10],
    [0, 10]
  ],
  domain: [
    [0, 0, 0.3, 0.3],
    [0.35, 0.35, 0.65, 0.65],
    [0.7, 0.7, 1, 1] 
  ],
  diagonal: false,
  upper: false
})

splom.draw()

where data, ranges and domains have the same length - this generates:

Now, if we want to just draw the three non-empty, how should we go about it? In this case, data should still be 3x3 both now there are only 2 x and 2 y axes.