OLD | NEW |
(Empty) | |
| 1 |
| 2 <!--- |
| 3 |
| 4 This README is automatically generated from the comments in these files: |
| 5 iron-iconset-svg.html |
| 6 |
| 7 Edit those files, and our readme bot will duplicate them over here! |
| 8 Edit this file, and the bot will squash your changes :) |
| 9 |
| 10 --> |
| 11 |
| 12 [![Build Status](https://travis-ci.org/PolymerElements/iron-iconset-svg.svg?bran
ch=master)](https://travis-ci.org/PolymerElements/iron-iconset-svg) |
| 13 |
| 14 _[Demo and API Docs](https://elements.polymer-project.org/elements/iron-iconset-
svg)_ |
| 15 |
| 16 |
| 17 ##<iron-iconset-svg> |
| 18 |
| 19 |
| 20 The `iron-iconset-svg` element allows users to define their own icon sets |
| 21 that contain svg icons. The svg icon elements should be children of the |
| 22 `iron-iconset-svg` element. Multiple icons should be given distinct id's. |
| 23 |
| 24 Using svg elements to create icons has a few advantages over traditional |
| 25 bitmap graphics like jpg or png. Icons that use svg are vector based so |
| 26 they are resolution independent and should look good on any device. They |
| 27 are stylable via css. Icons can be themed, colorized, and even animated. |
| 28 |
| 29 Example: |
| 30 |
| 31 <iron-iconset-svg name="my-svg-icons" size="24"> |
| 32 <svg> |
| 33 <defs> |
| 34 <g id="shape"> |
| 35 <rect x="50" y="50" width="50" height="50" /> |
| 36 <circle cx="50" cy="50" r="50" /> |
| 37 </g> |
| 38 </defs> |
| 39 </svg> |
| 40 </iron-iconset-svg> |
| 41 |
| 42 This will automatically register the icon set "my-svg-icons" to the iconset |
| 43 database. To use these icons from within another element, make a |
| 44 `iron-iconset` element and call the `byId` method |
| 45 to retrieve a given iconset. To apply a particular icon inside an |
| 46 element use the `applyIcon` method. For example: |
| 47 |
| 48 iconset.applyIcon(iconNode, 'car'); |
| 49 |
| 50 |
OLD | NEW |