Skip to main content
SimilarExport ZIP
100%

jayasaireddy santimalla

✓ Published1🌍 Public
JJayaSaiReddySantimalla@my.unt.edu
Last edited Feb 27, 2024
Created on Feb 27, 2024

This example shows a simple landscape scene rendered as an SVG graphic, including a sky, sun, mountain, river, trees, and birds. The visualization demonstrates basic D3.js v6 selection and shape-drawing methods, such as `select`, `append`, and `attr`, to construct geometric primitives like rectangles, circles, polygons, and paths. Data is hardcoded within the script rather than loaded from an external source. The code also defines reusable functions to draw repeated elements, such as trees and birds, illustrating a modular approach to building static vector illustrations with D3.

AI-generated description

An example showing the capabilities of VizHub:

  • Loads D3 via UNPKG.
  • Demonstrates use of import from "d3".
  • Demonstrates use of import from local ES6 modules.
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of jayasaireddy santimalla

This example shows a landscape scene with a sky, sun, mountain, river, trees, and birds, all rendered as SVG shapes. The D3.js library v6 is loaded via UNPKG, and the code uses D3 methods like `select` to target the SVG element and `append` with `.attr` to add and style the shapes. It draws the sun as a circle, the mountain as a polygon, and the river as a path with a quadratic Bezier curve, while trees and birds are generated by custom functions.

JJayaSaiReddySantimalla@my.unt.edu
91% match
Loading thumbnail…

nature scene

This example shows a simple nature scene built with D3.js, depicting a house, trees, clouds, sun, and a fence in an SVG canvas. The code uses D3’s selection and append methods to create each shape, including rectangles for the house and door, polygons for the roof, lines for palm tree trunks and fronds, and a path with d3.curveBasisClosed for the cloud silhouette. A circle represents the sun, while a long rectangle forms the fence. The visualization renders entirely with SVG elements, using hardcoded coordinates and colors to assemble the static scene.

Ssaisathyapriya097@gmail.com
78% match
Loading thumbnail…

Scene with d3.js!

This example showcases a simple animated scene built with D3.js, depicting a sunny landscape with a tree, a dog, and two butterflies. It demonstrates how D3’s selection and attribute methods—such as `select`, `append`, and `.attr`—construct static SVG shapes like rectangles, circles, and ellipses to form each element. The visualization renders entirely in SVG, with a sky-blue background and clearly defined shapes for each object. While no data is involved, the code highlights D3’s ability to manipulate the DOM directly, using hardcoded coordinates and dimensions to compose a cohesive scene.

Ppriyankajammigumpula@my.unt.edu
77% match
Loading thumbnail…

Fork of Fork of Bird's Landscape - D3.js

This example builds a static SVG scene of trees, plants, and two birds using D3.js v3 and raw SVG elements. It shows a foreground landscape with three stylized trees in varied greens and browns, while a larger amber bird sits on a branch and a smaller blue bird flies higher to the right. The rendering relies on SVG primitives like `circle`, `rect`, `ellipse`, `path`, and `polygon`, grouped with `g` elements and transformed via `translate` and `scale`. The page centers the SVG with CSS, and the code references external tutorials for SVG structuring, but no data or dynamic interactions are involved.

Yyogithareddy47@gmail.com
76% match
Loading thumbnail…

Tagore Reddy

This example renders a static nature scene of a sky, ocean, sun, palm tree, sandy island, and a stylized fish. It demonstrates loading D3 via UNPKG in an HTML file and using the `select` function from the imported `d3` module to append SVG shapes. The visualization builds the image by directly manipulating SVG elements such as `rect`, `circle`, `ellipse`, and `polygon` objects, with a loop for the palm leaves.

Cchilukuritagore1427@gmail.com
76% match
Loading thumbnail…

nature scene - D3.js

This example shows an animated SVG landscape featuring a bird, dog, and tree, with a sky that transitions through a full day-night cycle. It uses raw SVG elements created via the DOM API, including gradients for the sun and sky, and CSS animations to move celestial bodies. The scene is built entirely with JavaScript helper functions and SVG paths, with no external data sources or D3.js-specific functions.

Sshanmukhadatta4040@gmail.com
75% match
Loading thumbnail…

J_DV_D3_C01_SVG

This example displays a collection of basic SVG shapes—circles, paths, lines, and a rectangle—arranged on a 960-by-900 canvas, with a large translucent circle and a small globe icon drawn as a path. The code uses raw SVG elements and CSS styling directly in an HTML file, with no external libraries or JavaScript logic. It demonstrates static vector graphics rendering, showing how shapes with different fill colors, stroke properties, and coordinate positions compose a single scene. The rendering approach relies entirely on SVG’s declarative markup, with no interactivity or data binding.

Jjerald-lim
74% match
Loading thumbnail…

SDV_assignt_fork

This example shows a static nighttime seascape with a moon, clouds, an island with a tree, a star, and a fish, all composed from basic geometric shapes. Using D3.js v5’s `select` and SVG element constructors like `append` and `attr`, it draws rectangles, circles, ellipses, lines, and paths directly onto an SVG canvas. The scene is built entirely through DOM manipulation with hardcoded coordinates and fill colors, with no data-driven layout or animation.

BBlueT
74% match