Closed lokendradvs closed 2 years ago
I want to give some margin from the top in 80% title but am unable to do so. Can you let me know if this would be possible?
Did you check the issue?
There's no margin option. Pass an array to title
option.
"title": [
"working",
"in",
"progress"
],
Hi, Thanks for the reply but the same issue is appearing after trying the values into an array.
percentTitle = [ "", "80%" ]
Ok but if the data is coming dynamically then how it could be happen?
On Sun, 6 Mar 2022, 2:32 pm Boot Soon, @.***> wrote:
"title": [ "", "80%" ],
— Reply to this email directly, view it on GitHub https://github.com/bootsoon/ng-circle-progress/issues/177#issuecomment-1059922600, or unsubscribe https://github.com/notifications/unsubscribe-auth/AXEF4H7LJSCILCIRKH2E7NLU6RYBDANCNFSM5OXVZ76Q . Triage notifications on the go with GitHub Mobile for iOS https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Android https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub.
You are receiving this because you authored the thread.Message ID: @.***>
You can handle it in titleFormat
callback.
titleFormat A callback function to format title. It returns a string or an array of string.
[titleFormat] = "formatTitle"
// titleFormat callback example
formatTitle = (percent: number) => {
return [ "", percent + "%"]
}
It is showing 0 percent when I add these lines in my code
How will percentage work dynamically with a blank array because it is a number type so it is not coming into the array?
titleFormat
is a property in your HTML.
<circle-progress ...
[titleFormat]="formatTitle"></circle-progress>
formatTitle
is a function in your TypeScript.
formatTitle = (percent: number) => {
return [ "", percent + "%"]
}
Sorry it doesn't seem to work, just tried and where do we define the percent value in our code.
formatTitle
is a callback function. ng-circle-progress calls it when your progress changes.
<circle-progress ...
[percent]="otherPercentVariable"
[titleFormat]="formatTitle"></circle-progress>
formatTitle = (percent: number) => {
return [ "", percent + "%"]
}
You change the value of otherPercentVariable
or receive a value from a backend service and assign it to otherPercentVariable
. The formatTitle
function will be called and the title will change.
Great thanks but it is overlapping
Hide the unit (showUnits=false
) and handle subtitleFormat
function as the same as titleFormat
.
Great thanks, Now it looks fine to me
Need a margin on top for changing the position.