io-svg-image v1.0.6

io-svg-image

Insert in your html an svg image so the user can manipulate the svg style

Install

npm install io-svg-image

Usage

import SvgImageModule to your module

@NgModule({
  declarations: [
    ...
  ],
  imports: [
    ...,
    SvgImageModule,
    ...
  ]
})
export class AppModule { }

then use it in your html

...
<svg-image src="/assets/mysvg.svg"></svg-image>
...

Input

src : it can contain the SVG file you want to load and it can contain also contain SVG source in XML format

Example: change SVG fill color

In your html file add a class to your SVG image

...
<svg-image src="/assets/mysvg.svg" class="mysvg"></svg-image>
...

then in your global CSS file you add that class with path selector to select the path under your svg file

.mysvg path{
    fill: red !important
}

Test

You can download this project here and then you can run the demo project by running

• npm install
• ng serve demo