CanvasMol. Algorithm Ink | Aza Raskin. What is Algorithm Ink? How to use? Read the Context Free documentation, or just browse some of the other pieces of art and look at their source code. Not everything from Context Free is supported—like comments, z-depth, and *—but some new things are available, like MOUSECLICK, and MOUSEMOVE. Here's an example to get you started: startshape twoshapes rule twoshapes{ CIRCLE{s .5} SQUARE{x 1} twoshapes{y .2 s .5 b .1} } This draws a circle of scale 1/2 at the origin and square one space to the right. Get The Source & Help Out You can download contextfree.js and go wild. L-System. 12 Insanely Awesome Javascript Effects. Alright, have you ever seen these effects? Awesome, stunning and cool javascript effect! It's part of the chrome experiment and it's amazing. When I first look at it, I was like, whoa, that couldn't be done with flash few years ago! I have chosen 12 of them that I really like, and I hope you will enjoy them.
Best view with google chrome, firefox or Internet explorer will be a little bit laggy or could not run at all. Canopy Canopy is a fractal tree zoomer, vector style. Press play to start falling, click to go faster. A kind of kaleidscope made only of filled circles with opacity. Coda Popup Bubbles. In particular, Jorge Mesa writes to ask how to re-create their ‘puff’ popup bubble shown when you mouse over the download image. In essence the effect is just a simple combination of effect, but there’s a few nuances to be wary of.
How to Solve the Problem To create the puff popup bubble effect, we need the following: Markup that assumes that JavaScript is disabled. It would be fair to say that the popup would be hidden from the CSS.The hidden popup, correctly styled for when we make it appear.jQuery to animate the puff effect on mouseover and mouseout. The biggest trick to be wary of is: when you move the mouse over the popup, this triggers a mouseout on the image used to trigger the popup being shown. I’ll explain (carefully) how to make sure the effect doesn’t fail in this situation. I’ve provided a screencast to walk through how create this functionality. Watch the coda bubble screencast (alternative flash version) (QuickTime version is approx. 23Mb, flash version is streaming) HTML Markup. Image evolution.
What is this? A simulated annealing like optimization algorithm, a reimplementation of Roger Alsing's excellent idea. The goal is to get an image represented as a collection of overlapping polygons of various colors and transparencies. We start from random 50 polygons that are invisible. In each optimization step we randomly modify one parameter (like color components or polygon vertices) and check whether such new variant looks more like the original image. If it is, we keep it, and continue to mutate this one instead. Fitness is a sum of pixel-by-pixel differences from the original image. This implementation is based on Roger Alsing's description, though not on his code. How does it look after some time? 50 polygons (4-vertex) ~15 minutes 644 benefitial mutations 6,120 candidates 88.74% fitness 50 polygons (6-vertex) ~15 minutes 646 benefitial mutations 6,024 candidates 89.04% fitness 50 polygons (10-vertex) ~15 minutes 645 benefitial mutations 5,367 candidates 87.01% fitness Requirements.
15 Awesome Free JavaScript Charts / JavaScripts / Splashnology - Web Design and Web Technology Community. InShare11 Plotting your data can serve as a replacement to tabular data, and is also a great way to add practical graphics to your web page or application. There are many ways you can plot data, but here I have included 15 Awesome Free JavaScript Charts In Your Sites/Blog Pages which serves as a easy Charting solution. Hope you like it. FusionCharts – Delightful JavaScript Charts for your web & mobile apps FusionCharts Suite XT gives you delightful JavaScript charts that work across devices and platforms. Website: Trial: RGraph: HTML5 & Javascript charts for your website RGraph is a charts library written in Javascript that uses HTML5 to draw and supports over twenty different types of charts. RGraph is free to use on non-commercial websites such as personal blogs, educational or charity sites. Some of the features of RGraph: TufteGraph Advertisement Highcharts Flot.
2008 - A Year of Awesome JavaScript. Games It's been a great year for JavaScript games. It looks like DHTML and canvas-based games are now capable of taking over some of the areas where Flash used to dominate. Many people have been building remakes of classic video games like Super Mario, Pac-Man, Breakout, Space Invaders, Bomberman or T&C Surf Designs.
Others took the old arcade traditions and applied them to their own ideas, giving us cool games like Matt Hackett's Spacius, Mark Wilcox's Invaders from Mars, VertigoProject's RedLine Racing or a twist on the classic Tetris game. We've even seen some roleplaying games, like the very cool Tombs of Asciiroth or the more graphical CanvasQuest by Andrew Wooldridge and the Prototype based ProtoRPG by Pierre Chassaing. 2008 also saw a few libraries for JavaScript / DHTML game development pop up, most notably GameJS (pictured to the left with its demo game, Jetris) and GameQuery, the latter being an extension to the popular jQuery library. Demos Emulation Graphics Audio Odds and ends.