81 docs tagged with "Blockly"

The Blockly editor's window part by part - the toolbox and its search, the blocks on the workspace, the trash can, the 3D view, Run The Code, the toolbox button and the More menu - numbered as in the picture.

The tools the Rete, Blockly and TypeScript editors on bitbybit.dev offer AI agents while they are open - through WebMCP and on the page - to search components and blocks, build and change a script in checked batches that one undo reverses, run it, read what failed and look at the result.

Learn how to create and display angular dimensions for measuring angles in your 3D models with clear, professional annotations.

What every bitbybit.dev editor has in common: projects and scripts, assets, running code and reading its console, how drawing works, and what to do when a script fails.

What the Blockly editor on bitbybit.dev is and what you can build with it - interlocking blocks that turn into a program - with a detailed drone built step by step, the showcase scripts and where to start.

Every key and mouse gesture of the Blockly editor - copying, pasting and deleting blocks, undo and redo, swapping the canvas, saving - on Windows, Linux and macOS.

Larger Blockly scripts - a detailed drone, a hexagon hive, an advanced loft and a twisted polygon ornament - with what each one shows, the script file to download and open, and the page that explains it in every editor.

The fourth chapter of the Blockly drone - the arm's parts repeated around the frame by calls of around, an async function that alternates the propellers' spin, and another that sorts the lights into green and red by the side they are on.

The second chapter of the Blockly drone - a function with a count loop that repeats one shape evenly around the drone, its first use cutting the leg openings, an M3 bolt revolved from a profile with a hexagon socket, and the standoffs with their bolts between the arms.

The fifth chapter of the Blockly drone - a canopy lofted through rounded rectangles, an async function that traces a honeycomb of hexagon wires on its sides, a hatch with the bitbybit logo read from a STEP file cut into it, and the GPS mast and antennas.

The sixth chapter of the Blockly drone - a landing leg swept along a bent path, a revolved damper with a helical spring, a lofted rubber foot and the leg's bolts, each a function whose result around repeats for every leg.

The third chapter of the Blockly drone - functions for the arm with a pad for the motor and hexagonal cut-outs made in a loop, a motor revolved from a profile with cooling slots and its stator, a lofted two-blade propeller from a list of stations, and the bolts and the light, drawn one arm at a time.

The last chapter of the Blockly drone - the camera on its gimbal, its lens and the strapped battery, then one number changed to rebuild the drone with six arms and a propeller that shrinks to fit.

The first chapter of the Blockly drone - variables for the drone's sizes, a function that keeps the propeller in bounds, a lit stage and a function that makes each material's drawing options, then the carbon frame plate from a function with hexagon vents cut through it, and a second plate above it.

Learn to build a simple 3D table configurator using the Blockly visual editor on Bitbybit and then deploy it as an interactive website on StackBlitz using Bitbybit Runner.

How to find a Blockly block in the toolbox by category or by search, drag it onto the workspace, stack blocks that do something, plug in blocks that give a value, and change the values they start with.

Create a 3D printable Christmas tree ornament using wire offset and extrusion - perfect for festive decorations.

Learn how to use colors and apply them to 3D geometry in Bitbybit with examples in Rete, Blockly, and TypeScript.

Learn how to create compound shapes for better performance and grouped transformations in OCCT

Learn how to use compounds for efficient rendering of complex geometric patterns and assemblies

Getting started with visual and code-based parametric design on the Bitbybit platform.

Size an OCCT cube with a variable in Blockly, step by step with a picture of the editor after every step - make the variable, set it, draw the cube and read the variable into its size.

Learn how to create a surface by lofting between several wire shapes.

Learn how to create a surface by lofting between several wire shapes and use various advanced options that help you make more intricate shapes.

DXF file format is very popular in 2D CAD applications. Learn how to work with DXF files using OCCT.

The settings every coding editor on bitbybit.dev shares - split screen, monochrome wires, right-angled wires, labelled ends for wires between groups, the camera gizmo, the language, the rendering engine and the CAD kernel's 32 or 64-bit architecture - what each changes and which ones reload the editor.

Learn how to create a 3D shape by extruding a 2D wire profile or face.

Learn how to create basic face primitives that define surfaces and areas

Create an OCCT face from an ordered list of points, and see how point order, planarity and closure decide whether you get a valid face or a failed operation.

Create an OCCT face from a single closed wire, the most common way to turn an outline into a surface you can extrude, offset or boolean against.

Create hexagonal face patterns in OCCT that react to a control point, growing hexagons near it and shrinking distant ones for organic wave-like surface effects.

Create a 3D printable frost flower ornament using interpolated curves and 12-fold rotational symmetry.

Create a complex frozen snowflake ornament using zigzag patterns, advanced lofting, and selective face extrusion.

Create a simple 3D printable gem star decoration using polygon wire loft.

What bitbybit.dev offers and where to begin - projects and scripts, the Rete, Blockly and TypeScript coding editors, the Designer, the free npm packages, CAD Cloud, 3D Bits for Shopify and the model configurators.

Create intricate three-dimensional honeycomb structures by generating individual hexagon cells with controlled random heights, perfect for biomimetic architecture, structural optimization, and artistic installations.

Create flat honeycomb panels by sewing hexagonal faces together into unified structures, ideal for architectural panels, laser cutting templates, and manufacturing-optimized designs.

Create stunning honeycomb patterns and hexagonal perforations using BitByBit's subdivideToHexagonHoles function for architectural panels, biomimetic designs, and structural applications.

Learn how to use advanced hexagon pattern parameters to create intricate designs.

Generate a grid of hexagonal OCCT wires from rows, columns and radius, the starting point for panelling, perforation patterns and honeycomb structures.

Learn how to create a 3D website using Bitbybit Runner by integrating a visual program built with the Blockly editor into a StackBlitz project.

Learn how to create and display linear dimensions for measuring distances in your 3D models with clear, professional annotations.

Points, shapes and numbers often come as lists. How a function takes a whole list as one value, how each editor repeats a function for every item, and where to read more in each editor.

Learn how to create multiple parallel offsets from a single open wire using OCCT operations for various design and manufacturing applications.

Learn how to create offset shapes using various offset operations in OCCT - from simple wire and face offsets to advanced thick solids.

Learn how to create annotated pins with labels for marking important points and displaying information in your 3D models.

Learn how to generate a hexagonal grid of points and hexagon outlines using Bitbybit's Point class, with examples in Rete, Blockly, and TypeScript.

Learn how to use the Point class to create and visualize a spiral pattern of points in Bitbybit with Rete, Blockly, and TypeScript.

Bitbybit has many helper functions that could streamline some of the modeling tasks, such as subdividing given rectangle faces into multiple holes or wires.

Learn how to create 3D spiral or helical shapes by extruding a 2D wire profile along an axis while rotating it.

When a Rete, Blockly or TypeScript script runs on bitbybit.dev, where its 3D result and its console appear, how the split view and Swap Canvas work, and how to tell the kernels are still working.

Shells are the connected sets of faces that sit between a face and a solid in OCCT. Learn how to build them, when a shell needs to be closed, and how they feed solid construction.

Build a parametric flower from OCCT wires and faces, driving petal count, radius and curvature from a handful of numbers so the whole shape rebuilds as you change them.

Learn how to use outer and inner wire to create a face that has a hole.

Learn how to create parametric hollow grids with multiple holes arranged in regular patterns for applications like ventilation panels, perforated sheets, and decorative screens.

Solids are closed, watertight volumes in OCCT and the shape kind most downstream operations expect. Learn how to create them from primitives and from shells, and how to check one is valid.

Learn how to get volume and surface area of a solid

Create a simple 3D printable star ornament using polygon wire extrusion - perfect for tree toppers and holiday decorations.

Read STEP and IGES files into OCCT shapes - the compressed variants, passing file data from a browser, and how a file that cannot be read reports itself.

Import SVG drawings into OCCT geometry - which elements are supported, how faces and holes are worked out, and what to do about text and reused symbols.

The ways to write text in Bitbybit side by side - OCCT stroke wires, plain stroke points, JSCAD stroke solids and real fonts with the Pro text3d - what each gives you, where it lands, which font it uses and how fonts load - with an example in Rete, Blockly and TypeScript.

Learn how to create and format text strings and then render them as 3D text geometry in Bitbybit using Rete, Blockly, and TypeScript.

Working with the 3D view of the coding editors - turning, panning and zooming the camera, the camera gizmo's views, split screen and full screen, and exporting what is drawn as GLB, STL or a picture.

How to see the JavaScript a Blockly script turns into, with Export to runner, and copy or download it to run the script in your own web app.

Learn how to create thick solids from complex lofted surfaces using OCCT operations - from curved wire interpolation to volumetric solid creation.

Model a 3D-printable Christmas tree decoration in OCCT: build the outline from wires, give it thickness, and export a watertight solid ready for a slicer.

Learn how to create an elegant twisted polygon ornament by transforming and lofting hexagonal wires - perfect for 3D printing decorative pieces.

Where Rete, Blockly and TypeScript scripts on bitbybit.dev tell you what went wrong - the console, the node or block marked in red, the underlined code - and how to find and fix the cause.

Why a shape on bitbybit.dev only appears once it is drawn, what drawing turns it into, which game engine draws it, and what you can do with a drawn object.

Learn how to use draw components and functions within Bitbybit's Rete, Blockly, and TypeScript environments to render and customize 3D geometry.

How to make a Blockly variable and set, change and read it, and how to wrap blocks into a function of your own that does something or gives a value back.

Learn how to use vector span and easing functions to create interesting point distributions for drawing in Bitbybit, with examples in Rete, Blockly, and TypeScript.

What a TypeScript or Blockly script can reach when it runs in the editor - bitbybit, Bit, BABYLON and its GUI - what it cannot, top-level await, the console, how runs start and end, and why imports are limited to the script's own files.

Learn how to create basic wire primitives composed out of multiple edges

Create Bezier wires in OCCT with per-control-point weights, so you can pull the curve towards individual points without moving them and model conic sections exactly.

Learn how to create wires by combining multiple edges

Create helix and spiral wires in OCCT from radius, pitch and turn count - the base curve for threads, springs, twisted columns and swept tubes.

Learn how to create shape wire primitives composed out of multiple edges

Learn how to create various wires passing via or being controlled by collections of points

What a Blockly block's right-click menu offers - duplicate, comment, inline inputs, collapse, disable, delete and help - what the workspace's own menu does, how a block's tip explains it, and what a failed block looks like.

Build a first Blockly script step by step - a grid and 3D text stacked under it, values changed and plugged in - with a picture of the editor after every step and the finished script to run on the page.