Nan banana 2026

100%

Nan banana 2026

✓ Published0🌍 Public

Last edited Mar 5, 2026

Created on Mar 5, 2026

This example demos Google’s Nano Banana 2 image-generation model, rendering a marketing-style infographic that highlights the model’s key specs, including native 4K output, 14 aspect ratios, multilingual text rendering, and character consistency. It uses WebGL for the visual effects, driven by Three.js to composite layered animated panels and typography. The underlying data comes from a markdown guide listing 160 use cases and 500 prompts, with d3.forceSimulation positioning label nodes to avoid overlap while the scene cycles through sample ratios like 21:9 and 9:16.

AI-generated description

Similar vizzes

Loading thumbnail…

Gist 5f3654a871cd25cd4baf9fd51347d607

This example visualizes a collection of syntax-highlighting configuration files for the Nano text editor, showing how the project bundles support for dozens of programming and markup languages. The visualization uses a network graph built with D3.js’s `d3.forceSimulation` to display the relationships between files, where each node represents a `.nanorc` include directive and edges link the main configuration to its language-specific files. The rendering relies on `d3.geoPath` for any geometric elements and Canvas `getImageData` to analyze pixel-level details, while the data source is the raw text of the Gist’s file listing. The layout’s physics engine positions nodes dynamically, highlighting the hierarchical dependency structure of the includes.

115Dkatz

62% match

Loading thumbnail…

Car Report

This example displays a simple car report page with a heading listing two vehicle models: Nano and Hexa. The page uses D3.js, specifically the `select` function, to set the text content of a designated message div with a string imported from a local ES6 module. Styling is applied through an external stylesheet, giving the body a cyan background and increased font size. The visualization is static, showing basic HTML structure combined with D3 for DOM manipulation.

SSushant Kunkekar

57% match

Loading thumbnail…

HTML Cars Report

This example presents a simple, static list of three car models and their prices, with the 2010 NANO LX highlighted in red. The visualization is built with plain HTML and styled via a linked CSS file, using a monospace font at a large size. It relies on standard HTML list elements and a class selector, demonstrating basic data presentation without any JavaScript libraries or dynamic rendering.

VVinod-VIX

56% match

Loading thumbnail…

Gist 2dcaad3a5d177257ef30955eada2624a

This visualization uses Three.js to render a three-dimensional scene that presents an academic consent form and instructions for using ChatGPT in a high school digital culture class. The WebGL canvas displays the document text as a textured surface, with the form details, registration steps, and activity guidelines mapped onto the 3D geometry. The material appears to be a rendered paper-like plane with text projected across its surface, creating a physical representation of the digital document. The setup likely uses Three.js scene construction with text applied as textures to show the written information as part of the 3D space.

IIoTeacher

56% match

Loading thumbnail…

Activity 6

This example displays a static, high-resolution SVG scene rendered with D3.js and WebGL, featuring a detailed background image loaded from a base64-encoded JPEG. The code includes D3 via UNPKG and uses the `select` API to update a message element, demonstrating local ES6 module imports. The visualization combines a large 2880x1800 SVG canvas with an embedded pattern-filled rectangle, showcasing D3’s integration within a Vue framework for layered graphic composition.

HHemanthh81

56% match

Loading thumbnail…

Nintendo pixelation

The example converts a static image into a stylized NES-style pixelation by averaging colors in blocks of pixels and mapping them to the closest NES palette color in LAB color space. It processes the image in shuffled batches, updating the canvas progressively to show the transformation over time. The code uses D3 for selection and shuffling, Canvas `getImageData` and `putImageData` for pixel manipulation, and the `requestAnimationFrame` loop to animate the batch processing. The source image is loaded from "magritte.jpg," and the palette comes from the included `nes-palette.js`.

DDinoJay

56% match

Loading thumbnail…

scrollytest6

This example, titled "scrollytest6," is an animated, scroll-driven data visualization that combines SVG and WebGL rendering within the D3.js framework. The visualization demonstrates a technique for synchronizing narrative content with user scrolling, likely transitioning between different chart states or datasets as the user progresses through the page. The visualization uses D3's data parsing capabilities (d3-dsv) and custom scroll-handling logic to create a dynamic, story-telling experience. The rendering is hybrid: SVG is used for crisp, interactive elements while WebGL handles performance-intensive graphics, with animations smoothly tying the scroll steps together. The example is part of a series of scroll-based experiments by the author 35degrees, building upon earlier iterations (scrollytest1-5) to refine the technique. The visualization is built with D3 and licensed under MIT.

335degrees

55% match

Loading thumbnail…

namrata ba401 e2

This example displays the text “Hello HTML” at a very large font size centered on the page, with a companion message logged to the browser console. It demonstrates the basic integration of HTML, CSS, and JavaScript in a single document, using standard DOM styling and the `console.log` API. The visualization is a minimal static render with no data or interaction, serving as a starter template for web-based projects rather than a data-driven chart.

Nnamratakumari76

55% match