Raphael JS Vector Graphics.

By: Dawber, DamianMaterial type: TextTextPublisher: Olton : Packt Publishing Ltd, 2013Copyright date: ©2013Description: 1 online resource (154 pages)Content type: text Media type: computer Carrier type: online resourceISBN: 9781782169178Subject(s): Computer graphics | Image processing -- Digital techniques | SVG (Document markup language) | Web site developmentGenre/Form: Electronic books.Additional physical formats: Print version:: Raphael JS Vector GraphicsDDC classification: 776 LOC classification: T385 -- .D39 2013ebOnline resources: Click to View
Contents:
Intro -- Learning Raphaël JS Vector Graphics -- Table of Contents -- Learning Raphaël JS Vector Graphics -- Credits -- About the Author -- About the Reviewers -- www.PacktPub.com -- Support files, eBooks, discount offers and more -- Why Subscribe? -- Free Access for Packt account holders -- Preface -- What this book covers -- Who this book is for -- Conventions -- Reader feedback -- Customer support -- Downloading the example code -- Downloading the color images of this book -- Errata -- Piracy -- Questions -- 1. The Graphical Web -- Vector drawing on the Web -- Vector drawing libraries -- The SVG specification -- Working with Raphaël rather than SVG directly -- Applications of Raphaël -- Downloading Raphaël -- Creating Raphaël JavaScript applications -- Project structure and optimization -- Summary -- 2. Basic Drawing with Raphaël -- The drawing context -- Canvas coordinates -- Drawing basic shapes -- Embedding images -- Element attributes -- Basic fills -- Image fills -- Applying strokes -- Other attributes -- href -- opacity -- clip-rect -- Applying gradients -- Linear gradients -- Radial gradients -- Grouping elements -- Working with text -- Embedding custom fonts -- Summary -- 3. Drawing Paths -- Path drawing concepts -- Path drawing commands -- The moveto command -- The lineto commands -- The closepath command -- Drawing curves -- Quadratic Bézier curves -- Cubic Bézier curves -- Drawing arcs -- Utility methods for working with paths -- Element.getTotalLength() -- Element.getPointAtLength(length) -- Element.getSubpath(from, to) -- Catmull-Rom curves -- Summary -- 4. Transformations and Event Handling -- Basic transformations and event handling -- Basic transformations -- Translation -- Rotation -- Scaling -- Basic event handling -- Registering basic event handlers -- Unregistering basic event handlers -- Working with matrices.
Transformation matrices -- Using transformation matrices -- Using transformation matrices to perform shear -- The drag-and-drop functionality -- The Element.drag() method -- The onstart event handler -- The onend event handler -- The onmove event handler -- Dragging by example -- Dropping elements -- Bounding box overlapping -- Bounding box inside bounding box -- Summary -- 5. Vector Animation -- Basic animation -- Animating paths -- Animation easing -- Built-in easing formulas -- Custom easing using the cubic Bézier format -- Animating transformations -- Animation using custom attributes -- Custom attributes -- Animation along a path -- Pausing and resuming animation -- Summary -- 6. Working with Existing SVGs -- Inkscape -- Downloading Inkscape -- Getting started with Inkscape -- Inspecting paths -- Inkscape's XML Editor -- Taking paths from an existing SVG image -- SVG to Raphaël conversion tools -- Ready Set Raphaël -- Other converters -- Choropleth maps -- Creating choropleth maps -- Open source SVGs -- Summary -- 7. Creating a Suite of Social Media Visualizations -- Social network usage -- Getting started -- Using jQuery -- Social network usage data -- Drawing people icons -- Responding to icon clicks -- Drawing a key -- Tweets by time -- Getting started -- Tweets by time data -- The subtend custom attribute -- The counts custom attribute -- Updating the timer -- The animate helper method -- Iterating over our timers and starting the animation -- Supplementary material -- Facebook usage by year -- Golden tweets -- The future of Raphaël -- Milestones -- Long term goals -- Summary -- Index.
Summary: A stepbystep guide to understanding the principles underlying vector drawing, using illustrations and code demos along with interactive maps to fully exploit the JavaScript library to create a data visualization widget.Learning Raphaël JS Vector Graphics has been written for anyone with an interest in frontend browser technologies with little or no knowledge of vector graphics drawing. Designers, integrators, frontend developers, and data visualization developers will get something out of reading this book. The book assumes knowledge of HTML and CSS and a working familiarity with JavaScript.
Tags from this library: No tags from this library for this title. Log in to add tags.
    Average rating: 0.0 (0 votes)
No physical items for this record

Intro -- Learning Raphaël JS Vector Graphics -- Table of Contents -- Learning Raphaël JS Vector Graphics -- Credits -- About the Author -- About the Reviewers -- www.PacktPub.com -- Support files, eBooks, discount offers and more -- Why Subscribe? -- Free Access for Packt account holders -- Preface -- What this book covers -- Who this book is for -- Conventions -- Reader feedback -- Customer support -- Downloading the example code -- Downloading the color images of this book -- Errata -- Piracy -- Questions -- 1. The Graphical Web -- Vector drawing on the Web -- Vector drawing libraries -- The SVG specification -- Working with Raphaël rather than SVG directly -- Applications of Raphaël -- Downloading Raphaël -- Creating Raphaël JavaScript applications -- Project structure and optimization -- Summary -- 2. Basic Drawing with Raphaël -- The drawing context -- Canvas coordinates -- Drawing basic shapes -- Embedding images -- Element attributes -- Basic fills -- Image fills -- Applying strokes -- Other attributes -- href -- opacity -- clip-rect -- Applying gradients -- Linear gradients -- Radial gradients -- Grouping elements -- Working with text -- Embedding custom fonts -- Summary -- 3. Drawing Paths -- Path drawing concepts -- Path drawing commands -- The moveto command -- The lineto commands -- The closepath command -- Drawing curves -- Quadratic Bézier curves -- Cubic Bézier curves -- Drawing arcs -- Utility methods for working with paths -- Element.getTotalLength() -- Element.getPointAtLength(length) -- Element.getSubpath(from, to) -- Catmull-Rom curves -- Summary -- 4. Transformations and Event Handling -- Basic transformations and event handling -- Basic transformations -- Translation -- Rotation -- Scaling -- Basic event handling -- Registering basic event handlers -- Unregistering basic event handlers -- Working with matrices.

Transformation matrices -- Using transformation matrices -- Using transformation matrices to perform shear -- The drag-and-drop functionality -- The Element.drag() method -- The onstart event handler -- The onend event handler -- The onmove event handler -- Dragging by example -- Dropping elements -- Bounding box overlapping -- Bounding box inside bounding box -- Summary -- 5. Vector Animation -- Basic animation -- Animating paths -- Animation easing -- Built-in easing formulas -- Custom easing using the cubic Bézier format -- Animating transformations -- Animation using custom attributes -- Custom attributes -- Animation along a path -- Pausing and resuming animation -- Summary -- 6. Working with Existing SVGs -- Inkscape -- Downloading Inkscape -- Getting started with Inkscape -- Inspecting paths -- Inkscape's XML Editor -- Taking paths from an existing SVG image -- SVG to Raphaël conversion tools -- Ready Set Raphaël -- Other converters -- Choropleth maps -- Creating choropleth maps -- Open source SVGs -- Summary -- 7. Creating a Suite of Social Media Visualizations -- Social network usage -- Getting started -- Using jQuery -- Social network usage data -- Drawing people icons -- Responding to icon clicks -- Drawing a key -- Tweets by time -- Getting started -- Tweets by time data -- The subtend custom attribute -- The counts custom attribute -- Updating the timer -- The animate helper method -- Iterating over our timers and starting the animation -- Supplementary material -- Facebook usage by year -- Golden tweets -- The future of Raphaël -- Milestones -- Long term goals -- Summary -- Index.

A stepbystep guide to understanding the principles underlying vector drawing, using illustrations and code demos along with interactive maps to fully exploit the JavaScript library to create a data visualization widget.Learning Raphaël JS Vector Graphics has been written for anyone with an interest in frontend browser technologies with little or no knowledge of vector graphics drawing. Designers, integrators, frontend developers, and data visualization developers will get something out of reading this book. The book assumes knowledge of HTML and CSS and a working familiarity with JavaScript.

Description based on publisher supplied metadata and other sources.

Electronic reproduction. Ann Arbor, Michigan : ProQuest Ebook Central, 2018. Available via World Wide Web. Access may be limited to ProQuest Ebook Central affiliated libraries.

There are no comments on this title.

to post a comment.

Powered by Koha