drge

100%

✓ Published0🌍 Public

Last edited Apr 17, 2013

Created on Apr 17, 2013

This example demonstrates a simple interactive color-changing rectangle inside a ScalaFX application. It shows a basic JavaFX scene with a green background and a square that toggles between red and green when the mouse hovers over it. The code uses ScalaFX’s `JFXApp`, `Scene`, and `Rectangle` APIs, along with a binding expression (`fill <== when(hover)`) to trigger the color change. The rectangle is drawn directly as a shape node, with no external data source.

AI-generated description

Similar vizzes

Loading thumbnail…

test javafx

This example shows a JavaFX line chart rendered inside a Scala application, displaying 21 randomly generated x- and y-coordinate pairs on a shared axis. The chart uses `javafx.scene.chart.LineChart` with `NumberAxis` for both axes, while the UI includes a styled "Quitter" button that closes the primary stage when clicked. The data is produced with Scala’s `util.Random` and added to an `XYChart.Series`, though the series data is commented out, so the chart renders empty. The scene is set to 800 by 400 pixels with a whitesmoke background, demonstrating basic JavaFX stage, scene, and control setup from Scala.

RRCura

62% match

Loading thumbnail…

d3 course

This example demonstrates a single red rectangle that smoothly transitions to green and dramatically thickens its stroke when hovered, using CSS transitions on SVG `rect` elements. The code relies on plain HTML, CSS, and JavaScript, with no external libraries or data sources. It sets initial styles for the rectangle and defines a hover state, allowing the browser to interpolate the fill color and stroke width over three seconds. The empty script tag suggests the visualization is static, with all interaction handled purely through CSS.

AAlexander Garzo

61% match

Loading thumbnail…

Gist 4753564

This example demonstrates a JavaFX-based interactive scene builder where users can configure a custom table view and slider controls. The code constructs a UI using `javafx.scene.layout`, `javafx.scene.control`, and a custom `JFXTableView`, while binding data through `ObservableList` and `FXCollections`. It integrates a `DoubleSlider` and `DoubleTextField` for precise numeric input, with event handling via `EventHandler` and property binding through `javafx.beans.binding`. The rendering relies on JavaFX's scene graph, and the simulation is defined in Scala with `scala.collection.JavaConversions` for interoperability.

RRCura

61% match

Loading thumbnail…

test

This example displays a single red rectangle on an SVG canvas. The rectangle is defined with inline attributes and CSS styles that apply a border and fill color. Interactive behavior is included: hovering over the shape triggers a CSS transition, gradually changing its fill to green and expanding its stroke width over three seconds. The code uses plain HTML, CSS, and SVG, with no external libraries. The rendering relies on the SVG `rect` element and CSS `:hover` and `transition` properties.

Ssirenajbpearl@gmail.com

59% match

Loading thumbnail…

Javascript A6

This example demonstrates a blank interactive SVG canvas where a single rectangle with the ID `change-hover` transitions its fill color to green over three seconds when hovered, using CSS transitions. The page sets up basic JavaScript syntax—variables, objects, loops, and functions—commented out for educational reference, but no active D3 or data visualization code executes. The rendering is plain SVG embedded directly in HTML, with no external data sources or libraries beyond standard CSS and JavaScript.

CCaroline Ghisolfi

58% match

Loading thumbnail…

SVG FUNDAMENTALS

This example demonstrates fundamental SVG rendering by displaying a single red rectangle with a thick black border inside a 900-by-900 SVG canvas. The rectangle transitions over three seconds when hovered, changing its fill to green and expanding its stroke width, using CSS properties for both styling and animation. The code relies on basic SVG elements and CSS hover states, with no additional JavaScript libraries or data sources beyond the static markup.

OOscar Muindi

58% match

Loading thumbnail…

Fork of SVG fundamentals E2

This example demonstrates a simple interactive SVG graphic: a single red rectangle with a thick black border that transitions smoothly to a green fill and an even thicker border when hovered. It uses CSS transitions applied directly to SVG `rect` elements, triggered by the `:hover` pseudo-class. The rendering is static SVG within an HTML document, with the transition duration set to 2000 milliseconds. The code relies on native browser CSS support rather than JavaScript libraries, showcasing how SVG styling and animation can be handled purely through stylesheet rules.

Ppanthabuddhi@gmail.com

58% match

Loading thumbnail…

test

A full-width red rectangle sits against a plain white background, its thick black stroke defining the shape. The example showcases a simple CSS and SVG interaction, where the rectangle transitions to green on hover. Written as a minimal HTML page, it uses inline CSS for styling and transitions, while JavaScript is included but not yet utilized. The SVG element is drawn directly in the markup, offering a straightforward demonstration of static vector graphics and hover feedback.

88ingo8ongo

58% match