1.0.1 • Published 6 years ago
ngx-arc-text v1.0.1
ngx-arc-text
Wrapper Library of arc-text to curve any text font on the web directly with angular.
Install
npm install ngx-arc-text --save
Examples
Usage
- Add to import Modules
import { NgxArcTextModule } from 'ngx-arc-text';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
NgxArcTextModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
- You can use NgxArcTextComponent in your component:
<ngx-arc-text
[text]="text"
[arc]="arc"
[direction]=direction
#letters>
</ngx-arc-text>
Params
Parameter | Type | Default | Description |
---|---|---|---|
text | string | Text you want to curve | |
arc | number | 150 | Angle you want to curve |
direction | number | 1 | 1 is clockwise mode and -1 is counter-clockwise mode |
Function
Name | Params | Description |
---|---|---|
update | Re-Render again the curve text, is necesary if you change all style in your font, for example, size or font-family. |
how to access?
You can see in the example the tag '#letters', so in your controller you can get the ViewChild.
import { INgxArcTextComponent } from 'dist/ngx-arc-text';
@ViewChild('letters') letters: INgxArcTextComponent;
Now you can update and see the component status.
Author
Alex Marcos Gutierrez
License
MIT
1.0.1
6 years ago