Skip to main content
SimilarExport ZIP
100%

MrW's VizHub Docu

✓ Published3🌍 Public
RRussell Watson
Last edited Feb 5, 2020
Created on Jan 30, 2020
Forked from HTML Starter

This example documents the keyboard shortcuts available in the VizHub editor, presenting a table that maps Windows and Mac key combinations to CodeMirror and VIM commands. It also includes a separate HTML page that simply displays the title “MrW’s Vizhub Docu” and the word “README” with static CSS styling. The project uses no external libraries, relying on plain HTML, CSS, and Markdown formatting in the README file to convey the information.

AI-generated description

Editor Shortcuts

The vizhub editor supports

(My) Most common keys:

Win Mac Command
ALT+V ALT+V VIM ↔︎ CodeMirror keys
CODE MIRROR KEYS
Code
^/ toggle comment
(⇧)Tab (reverse-) indent
Line
^k kill line Ꮖ→
⌘⌫ del line ←Ꮖ
^D ⌘D ??? delete line
^⇧D ⌘⇧D duplicate line
← ↑ ↓ → ← ↑ ↓ → Navi
^a / home goLineStart / Smart
^⇧↑ / ↓ move up/down
VIM EDITOR KEYS
See link above
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of MrW's VizHub Docu

This example documents the keyboard shortcuts available in the VizHub editor, presenting them in a Markdown table within the README. The visualization itself is a minimal HTML page that displays only the title and the word "README" with large, centered typography. The code relies on standard HTML and CSS for styling, while the documentation references CodeMirror and VIM key bindings, including commands like toggling comments and killing lines. It does not use any data visualization libraries, instead serving as a static reference chart.

GGodzillaJim
88% match
Loading thumbnail…

Markdown Demo

This example showcases the rendering of Markdown content in VizHub, demonstrating a wide range of syntax including headings, emphasis, links, tables, code blocks, blockquotes, task lists, and embedded HTML. The README.md file serves as the Markdown source, while the visualization includes an index.html that displays a large "Hello HTML!" message styled with CSS. The example highlights how VizHub processes Markdown and HTML files, using standard Markdown parsing and HTML rendering to present the content in the gallery. It does not use any additional JavaScript libraries for data visualization.

CCurran Kelleher
70% match
Loading thumbnail…

New Doc

This example demonstrates the flexibility of VizHub for creating and styling a simple HTML document. It presents a page with a large heading and a bulleted list, where the first bullet is highlighted in red, all displayed against a dark blue background with prominent white text. The code imports the `select` function from D3.js to set the text content of a message div, pulling the string from an ES6 module, while a separate CSS file imports the Ubuntu font and controls overall page styling.

Ssaiyam-jain
68% match
Loading thumbnail…

vizHub

This example renders a nearly blank HTML page with centered text, displaying the title "vizHub" at a massive font size. It demonstrates a minimal setup using plain CSS for styling and JavaScript for browser interaction, logging the string "cool" to the developer console upon load. The page relies solely on the Document Object Model and standard web APIs, with no external libraries or data sources involved. It serves as a bare-bones starter template for embedding custom visualizations in a React framework context.

Sstanemurhula
66% match
Loading thumbnail…

Hello VizHub

This example demonstrates a minimal VizHub project structure, showing how an HTML page can load external CSS and JavaScript resources. The index.html file contains an empty body element, while the style.css file defines the page’s visual styling. It illustrates the basic scaffolding required for a VizHub visualization, with the HTML serving as the container and the CSS providing formatting. The example uses no JavaScript libraries or data sources, focusing purely on the static document and styling setup.

NNickJolly
65% match
Loading thumbnail…

Hello VizHub

This example displays the text “Hello VizHub!” on a dark blue background, using a large, light-colored Ubuntu font. It demonstrates the basic structure of a VizHub project, including an HTML page, a CSS stylesheet, and JavaScript modules. The visualization employs D3.js v5, specifically using the `select` function to target the HTML element and set its text content, while also showcasing the use of ES6 modules for organizing code.

Kkau91
65% match
Loading thumbnail…

Hello VizHub

This example displays the message “Hello VizHub!” in large, centered, styled text on a dark blue background. It demonstrates the basic structure of a VizHub project, separating code into an HTML entry point, a JavaScript module, and a CSS stylesheet. The visualization uses D3.js v5, specifically the `select` function, to set the text content of a `div` element. The text is styled using the Ubuntu font imported from Google Fonts, with the background color defined in CSS.

Kkmartinf
65% match
Loading thumbnail…

Untitled

This example demonstrates VizHub's basic capabilities with a minimal web page. It displays the text "Hello VizHub!" in large, centered Ubuntu font against a dark blue background. The page imports D3.js and uses its `select` function to set the text content of a `div` element, while a local ES6 module exports the message string. The styling is applied through a separate CSS file.

FFelipe Menegossi
65% match