Perspective - Best Way To Display Grid 10,000 x 384

All,

I have data that is just 1s and 0s. I am reading the bits out of 120,000 DINTs. That’s a burden as it is, but now I am trying to display this in a grid format (0=Color 1, 1=Color 2). I tried to create a table that was 10,000 rows and 384 columns via a script without any data even in it. Once I get out to about 100 columns at 10,000 rows deep, my gateway crashes. Am I missing a very simple way to display this information?

Are you trying to display this in Vision or Perspective?

edit: oops, title…

Perspective. I don’t think I was clear its 3,840,000 bits, 10,000x384

Thanks for the speedy response.

I don’t know… this seems like way too much data to display using any kind of first class components. If it were Vision I’d suggest custom rendering using the paintable canvas. For Perspective you’d have to render an image in script and load it somehow. Maybe somebody else has a better idea.

Yeah, the first vaguely performant way that occurs to me is manually constructing a BMP as a byte array, then rendering it using a data URI in an Image component.
It won’t be interactable, and actually constructing the image bytes is non-trivial, but that’s my first idea.

Stepping back a bit - is it actually that useful to display 120,000 points to someone? What action is going to be taken based on the state of this mega-display?

@PGriffith you are asking the same questions we are asking. I have been thinking the amount of time involved in this is not worth the effort.

@Kevin.Herron , @PGriffith I was on the track of creating an image at one point. It was looking like I was going to need to add some python libraries to make it happen.

1 Like

A WebDev endpoint to to construct an image is what I would do.

2 Likes

Okay looking into this now. Thanks for the advice.

I can’t remember who did it, but in the last 12 months there was a an impressive solution presented in this forum about how to generate a really large heat map. I’d post a link if I could find it.

This one maybe?

1 Like

That was teh one I was thinking about.

It is neat, but I don’t think plotting 3.84 million points on the XY chart ends well :laughing:

2 Likes

@peter @Kevin.Herron

The chart may not work, but that SVG library may be something to look into unless I am missing something. Just need a viewer to open the SVG and I suppose a window command to open it. What I didn’t explain is that this isn’t something that needs to be kept up with realtime. Maybe created every several minutes and displayed as a static image. At least that’s what the requirements are for now.

Thanks.

even with svg, looping over that many elements is gonna require some time.
i dont think it can handle that many elements. i doubt it kan even handle 5k…

id say images usualy work faster with these kinda numbers. or create a module and use html5canvas / js to generate it, that goes a lot better. With html5canvas ive generated more than a million moving 3d objects so a grid should be no problem xd

I’m looking into something that would provide a bmp. My fear in creating an svg would be in the length of the string :confused:

1 Like

You create a BuffferedImage of the correct dimensions and pixel type, then get its Graphics object. Paint on the graphics object like you would in a PaintableCanvas component, then use ImageIO to generate the target file format bytes. (I would use PNG, not BMP. Compresses a bit even when lossless.)

1 Like

Some Java for inspiration if someone wants to translate to Jython:

class Scratch {
    public static void main(String[] args) throws IOException {
        Random r = new Random();
        boolean[][] data = new boolean[10_000][384];
        for (int x = 0; x < 10_000; x++) {
            for (int y = 0; y < 384; y++) {
                data[x][y] = r.nextBoolean();
            }
        }

        BufferedImage image = new BufferedImage(
            10_000,
            384,
            BufferedImage.TYPE_INT_RGB
        );

        for (int x = 0; x < 10_000; x++) {
            for (int y = 0; y < 384; y++) {
                image.setRGB(x, y, data[x][y] ? Color.RED.getRGB() : Color.BLACK.getRGB());
            }
        }

        ImageIO.write(image, "JPEG", new FileOutputStream("/Users/kevin/Desktop/test.jpeg"));
    }
}

Output (2mb…):

5 Likes

nice!

its kinda big but 2mb isnt the worst… the problem is that 10000x384 is so wide, not sure if you can get any usefull info out of it xd seems like it would be a better idea to split it up a couple of times and whos multiple smaller images under eachother…
so just use less data xd

Yeah it’s hard to believe this is actually useful to anybody. Maybe if it was blown up even larger by using multiple pixels per data point you could see patterns start to emerge (in the real data, not my random data)… but still…

doubling the pixels wouldnt do much help here as the ratios would still be way off.
maybe only adding some extra in the height, but that doubles the size of the image and finding a pattern would even be harder… unless you also add in a white line or two between each row…