Setting the Stage for SVG Animation

•

1 j'aime•147 vues

A top level talk about the current tooling around SVG Animation and workflow in 2016 done at NewcastleJS. Warning: this contains screenshots of Macromedia Flash.

Présentations et discours publics

<svg width="100%" height="95%" style="background: #c61c64">
<rect x="100" y="100" width="200" height="100" fill="blue" />
<circle cx="300"
cy="300"
r="50"
style="fill:green"
/>
<text x="50%" y="50%" font-size="40">svg aye</text>
<polyline points="10 35, 30 60, 40 50" id="test" />
<path d="M10 80 C 40 10, 65 10, 95 80 S 150 150, 180 80"
stroke="black" fill="transparent"/>
</svg>

Contenu connexe

En vedette

Gamification - Inovação no contact center

Manuel Pimenta

Diego giulliani

ElibellRo21

vOffice365 - November 2016 - itgroove - What's New in Office 365 "What's New in Office 365" - A summary guide through the newest changes to Office 365 as of November 23, 2016 - including announcements about Microsoft Teams, Microsoft SharePoint, Office for Mac Touch Bar Support, Microsoft Access, Microsoft Bookings, and a statement about the tools in the Office 365 toolkit for Communications and Planning, and Ownership, Process and Data management. Also a reminder that you can tune into weekly Office 365 tips and tricks at itgroove Bites and itgroove Bytes. Presented by Alec McCauley and Noel Feliciano of itgroove Professional Services Ltd. at the November 23, 2016 meeting of the Victoria Office 365 Users Group in Victoria, BC, Canada.

vOffice365 - November 2016 - itgroove - What's New in Office 365

Regroove

Proceso de votacion primarias 2013

Vicente Bove

Escuela de formación de soldados

lucio ismael Ramos condo

Diario Resumen 20161124

Diario Resumen

2009 a 5 class questions preview

Jem Vales

NCerniauskienes_patikslinimas del STT

Ph.D. Nendre Cerniauskiene

Presenta23

Julio Guzman Zegarra

A sidewalk as part of the road facilities to secure the pedestrian safety in Korea shall be provided when the pedestrian and vehicle traffic reach to a certain level but applying this regulation to the rural road where there are less pedestrian traffic but vehicle traffic at high speed and thus the driver's attention to the pedestrians is relatively low is not rational. Thus the installation of the sidewalk shall be determined, taking into account of the pedestrian traffic accident record and the characteristics from the viewpoint of traffic environment to the pedestrian. Installation of sidewalk is greatly dependent on economic efficiency, particularly to the rural road. For rational investment within the given budget, it's necessary to determine the priority with regard to sidewalk installation, considering the pedestrian safety, regional society's need and installation effect comprehensively. Thus this study is intended to propose the evaluation items and quantitative method with regard to the installation priority in consideration of the function of the road to be installed, regional social and cultural characteristics and overall road and traffic conditions such as pedestrian traffic pattern and school.

The Study on Method to Determine the Priority in Sidewalk Installation on Rur...

inventionjournals

Convention

Bruna Martins

TIGRES ASIÁTICOS e novos tigres

Natalia Guerino

cv-Shabbir -1-

SHABBIR KHAN Shabbir.khan

Sistematización

Jose Becerra

Eric Lanham_Resume_OCT2016-with references

Eric Lanham

Dokter en Social Media (KNMG)

Michael van Balken

Proyecto

tabiinc

En vedette (17)

Gamification - Inovação no contact center

Diego giulliani

vOffice365 - November 2016 - itgroove - What's New in Office 365

Proceso de votacion primarias 2013

Escuela de formación de soldados

Diario Resumen 20161124

2009 a 5 class questions preview

NCerniauskienes_patikslinimas del STT

Presenta23

The Study on Method to Determine the Priority in Sidewalk Installation on Rur...

Convention

TIGRES ASIÁTICOS e novos tigres

cv-Shabbir -1-

Sistematización

Eric Lanham_Resume_OCT2016-with references

Dokter en Social Media (KNMG)

Proyecto

Similaire à Setting the Stage for SVG Animation

SVG overview

Satoshi Watanabe

Html5 SVG

Nisa Soomro

Amy Cheng Web Developer, New York Magazine Drawing a Circle Three Ways: Generating Graphics for the Web There are multiple ways to generate graphics for the web. In this talk, we’ll learn three ways create a circle: CSS, SVGs, the Canvas. Each approach has its advantages and disadvantages. Which one is best for mobile performance? Which one should I use to create visualizations based on real-time data? Which one is the best for personalized user interfaces? We’ll answer these questions and explore how these technologies offer us possibilities of visual expressiveness on the web, across different form factors and platforms.

Drawing a Circle Three Ways: Generating Graphics for the Web

Cloudinary

HTML 5 گرافیک دو بعدی در

Shiraz LUG

SVG, CSS3, and D3 for Beginners

Oswald Campesato

SVG vs Canvas - Showdown of the Painters

Phil Reither

A HTML5 platform demókon keresztül

Zoltán Dávid

Svg Basics

Michael van Engelshoven

MOConf'13: WebNotBombs: Optimize this

Boris Zapolsky

While I was working on a HTML5 project I found this problem of creating SVG (Scalable Vector Graphics) elements dynamically in JavaScript. For example creating vector circles inside a for loop and adding them to the page. HTML5 supports inline SVG, so you can directly use <svg>your code</svg> inside <body> to create vector graphics. But I had the task of creating them in the script. So I have put forward a small example and here is how to do it.

Creating dynamic SVG elements in JavaScript

Joseph Khan

Фабрика "Blockly" (исправлено)

OlesiaJL

Flash Camp - Degrafa & FXG

jmwhittaker

RaphaëlJS magic

Kseniya Redunova

SVG and the web

Ken Shoufer Web Design

HTML5 تکنولوژی های موجود در

Shiraz LUG

Thats Not Flash?

Mike Wilcox

CANVAS, SVG, WebGL, CSS3, WebEvent

민태 김

I Can't Believe It's Not Flash

Thomas Fuchs

D3.js

Swapnil Gaidhankar

Web accessibility

Eb Styles

Similaire à Setting the Stage for SVG Animation (20)

SVG overview

Html5 SVG

Drawing a Circle Three Ways: Generating Graphics for the Web

HTML 5 گرافیک دو بعدی در

SVG, CSS3, and D3 for Beginners

SVG vs Canvas - Showdown of the Painters

A HTML5 platform demókon keresztül

Svg Basics

MOConf'13: WebNotBombs: Optimize this

Creating dynamic SVG elements in JavaScript

Фабрика "Blockly" (исправлено)

Flash Camp - Degrafa & FXG

RaphaëlJS magic

SVG and the web

HTML5 تکنولوژی های موجود در

Thats Not Flash?

CANVAS, SVG, WebGL, CSS3, WebEvent

I Can't Believe It's Not Flash

D3.js

Web accessibility

Dernier

(Vivek)Call Us, 8448380779,Call girls in Delhi NCr – We Offer best in class call girls. escort Service At Affordable Price At low Rate with Space Night 8000 We Are One Of The Oldest Escort and Call girls Agencies in Delhi. You Will Find That Our Female Escorts Are Full Of Fun, Sexy And They Would Love Enjoy Your Company. We Have A Fantastic Selection Of Escort Ladies Available For In-Calls As Well As Out-Calls. Our Escorts Are Not Only Beautiful But All Have Great Personalities Making Them The Perfect Companion For Any Occasion. In-Call:- You Can Come At Our Place in Delhi Our place Which Is Very Clean Hygienic 100% safe Accommodation. Out-Call:- You have To Come Pick The Girl From My Place We Are Also Provide Door Step Services (Delhi Ncr, Noida, Gurgaon, Faridabad, Ghaziabad Note:- Pic Collectors Time Passers Bargainers Stay Away As We Respect The Value For Your Money Time And Expect The Same From You Hygienic:- Full Ac room And Clean Rooms Available In Hotel 24 * 7 Hourly In Delhi NCR More Details, With WhatsApp Number, +91-8448380779

Busty Desi⚡Call Girls in Sector 51 Noida Escorts >༒8448380779 Escort Service-...

Delhi Call girls

Yesterday in Lagos, I had the honour of delivering a lecture titled “If this Giant Must Walk; Manifesto for a New Nigeria“ at the Inaugural Memorial Lecture of Prince Emeka Obasi, founder and publisher of Business Hallmark and the inspirational figure behind the Public Policy Research and Analysis Centre - promoters of the revered Zik Leadership and Governance Awards. My lecture focused on the challenges of nation-building in Nigeria and how we can approach them in a way that promotes progress and unity. I discussed the many sources of concern about our country’s future prospects, including violent conflicts, revisionist contestations of the Amalgamation Act of 1914, discontent with the Nigerian economy, and dysfunctions in the federal system. Central to my lecture was the call to address these challenges by crafting a new manifesto for Nigeria. This manifesto, I proposed, should champion integrity, compassion, character, competence, and commitment to national unity and progress within a framework of democratic governance and cultural diversity. I firmly believe that by doing so, we can guide Nigeria to stride forward with pride and purpose. I want to thank the Board and Management of the Public Policy Forum for their kind invitation to speak at this important event and for their commitment to promoting public policy research and analysis in Nigeria. My gratitude also to the late Prince Emeka Obasi, a true inspiration and a builder of bridges across divides, for his contributions to the country. My thoughts are with his family and loved ones.

If this Giant Must Walk: A Manifesto for a New Nigeria

Kayode Fayemi

Dreaming Marissa Sánchez Music Video Treatment

nswingard

lONG QUESTION ANSWER PAKISTAN STUDIES10.

lodhisaajjda

The workplace ecosystem of the future 24.4.2024 Fabritius_share ii.pdf

Senaatti-kiinteistöt

BDSM⚡Call Girls in Sector 93 Noida Escorts >༒8448380779 Escort Service

Delhi Call girls

• For a full set of 390+ questions. Go to https://skillcertpro.com/product/aws-data-engineer-associate-dea-c01-exam-questions/ • SkillCertPro offers detailed explanations to each question which helps to understand the concepts better. • It is recommended to score above 85% in SkillCertPro exams before attempting a real exam. • SkillCertPro updates exam questions every 2 weeks. • You will get life time access and life time free updates • SkillCertPro assures 100% pass guarantee in first attempt.

AWS Data Engineer Associate (DEA-C01) Exam Dumps 2024.pdf

SkillCertProExams

BDSM⚡Call Girls in Sector 97 Noida Escorts >༒8448380779 Escort Service

Delhi Call girls

Aesthetic Colaba Mumbai Cst Call girls 📞 7738631006 Grant road Call Girls ❤️-...

Pooja Nehwal

Bring back lost lover in USA, Canada ,Uk ,Australia ,London Lost Love Spell C...

amilabibi1

SaaStr Workshop Wednesday w/ Lucas Price, Yardstick

saastr

Presentation on Engagement in Book Clubs

samaasim06

Thirunelveli call girls Tamil escorts 7877702510

Vipesco

My Presentation "In Your Hands" by Halle Bailey

hlharris

Chiulli_Aurora_Oman_Raffaele_Beowulf.pptx

raffaeleoman

Dreaming Music Video Treatment _ Project & Portfolio III

NhPhngng3

Causes of poverty in France presentation.pptx

CamilleBoulbin1

Introduction to Prompt Engineering (Focusing on ChatGPT)

Chameera Dedduwage

💚❤️Call girl in Chandigarh ☎️8868886958☎️ Call Girl service in Chandigarh☎️ Chandigarh Call Girls Service ☎️ Call Girls In Chandigarh Call Girl Service In Chandigarh 💯Call Ruhi 🔝8868886958🔝Chandigarh Call Girl WhatsApp Chat: ☎️ +91-8868886958 Call Girls In Chandigarh offer you everything from intimate moments to wild nights - be it intimate or wild. Their girls are always prepared to meet all your needs and desires so you're assured a memorable experience with them. Beautiful Babes are sure to turn heads wherever they go, captivating men with their seductive personalities and captivating looks - not to mention their sensually alluring bodies that are sure to satisfy all your naughty fantasies, from blowjobs to anal massages; not forgetting BDSM and orgies as well. Show them some appreciation when the time is right. Call Girl Chandigarh that their clients can be very demanding. To maintain their reputation and gain more clients, these sexy call girls always work tirelessly to provide exceptional service that ensures each customer's happiness - so much so that many men seek them out to have an unforgettable experience with Passionate about providing erotic pleasure for their clients - fulfilling all sexy fantasies while offering role play services such as BDSM. ★OUR BEST SERVICES: - FOR BOOKING ★ A-Level (5-star escort) ★ Strip-tease ★ BBBJ (Bareback Blowjob) ★ Spending time in my rooms ★ BJ (Blowjob Without a Condom) ★. Extra ball (Have ride many times) ☛ ☛ ☛ ✔✔ secure✔✔ 100% safe WHATSAPP CALL ME💥✨✨⭐⭐⚡💦💦💨🔥💫💫 Their services range from erotic encounters and movie dates to in-call and out-call services, making this option available 24/7. Available for services including NSA, threesomes and foursomes sessions as well as massage services and casual foreplay - they even provide real girlfriend experience. Find one online or visit local women's clubs, hotels or restaurants. Hiring a Chandigarh call girl for an evening or day out can be the perfect addition to your social gathering or office event, or you could arrange for her to visit your home or hotel room. Not only are these women gorgeous, they're intelligent as well, with great senses of humor - sure to please and leave you wanting more. If you want a cheap escort in Chandigarh, look for someone who is either a student or works part time so that she will always be available when you need her. In addition to this, look for housewives as this ensures they have stable lives that can keep you satisfied for extended periods. These beautiful ladies will capture your attention at first sight with stunning eyes and full, seductive lips; not to mention a seductive personality that makes you want to spend more time with them; moreover they are discreet enough to meet up anywhere nearby! Hiring a call girl in Chandigarh can be done through either the internet or calling her directly, with services like massage or sex sessions offered to request from specific agencies within.

No Advance 8868886958 Chandigarh Call Girls , Indian Call Girls For Full Nigh...

Sheetaleventcompany

Sector 62, Noida Call girls :8448380779 Noida Escorts | 100% verified

Delhi Call girls

Dernier (20)

Busty Desi⚡Call Girls in Sector 51 Noida Escorts >༒8448380779 Escort Service-...

If this Giant Must Walk: A Manifesto for a New Nigeria

Dreaming Marissa Sánchez Music Video Treatment

lONG QUESTION ANSWER PAKISTAN STUDIES10.

The workplace ecosystem of the future 24.4.2024 Fabritius_share ii.pdf

BDSM⚡Call Girls in Sector 93 Noida Escorts >༒8448380779 Escort Service

AWS Data Engineer Associate (DEA-C01) Exam Dumps 2024.pdf

BDSM⚡Call Girls in Sector 97 Noida Escorts >༒8448380779 Escort Service

Aesthetic Colaba Mumbai Cst Call girls 📞 7738631006 Grant road Call Girls ❤️-...

Bring back lost lover in USA, Canada ,Uk ,Australia ,London Lost Love Spell C...

SaaStr Workshop Wednesday w/ Lucas Price, Yardstick

Presentation on Engagement in Book Clubs

Thirunelveli call girls Tamil escorts 7877702510

My Presentation "In Your Hands" by Halle Bailey

Chiulli_Aurora_Oman_Raffaele_Beowulf.pptx

Dreaming Music Video Treatment _ Project & Portfolio III

Causes of poverty in France presentation.pptx

Introduction to Prompt Engineering (Focusing on ChatGPT)

No Advance 8868886958 Chandigarh Call Girls , Indian Call Girls For Full Nigh...

Sector 62, Noida Call girls :8448380779 Noida Escorts | 100% verified

Setting the Stage for SVG Animation

1. hi.

5. Setting the Stage for Animation

6. What is SVG

7. What isWhy vector

8. JUST SCALE IT

10. How does this apply to web development?

11.

12. … mo’ pixels mo’ problems 2x

13.

14. Sharp Small Editable

15. Smoke and mirrors.

16. current tooling

17. tooling past

18.

19.

20. <svg width="100%" height="95%" style="background: #c61c64"> <rect x="100" y="100" width="200" height="100" fill="blue" /> <circle cx="300" cy="300" r="50" style="fill:green" /> <text x="50%" y="50%" font-size="40">svg aye</text> <polyline points="10 35, 30 60, 40 50" id="test" /> <path d="M10 80 C 40 10, 65 10, 95 80 S 150 150, 180 80" stroke="black" fill="transparent"/> </svg>

21.

22. Benefits

23. ILLUSTRATOR

24. urgh. animation?

25. animation = code Grouping is GUI

26. what are we creating?

27.

28. 1 2 3

29.

30.

31.

32.