question-mark

Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

How can I format YAxis Label

See original GitHub issue

Issue Description

Could I show 1000 as $ 1K in yAxis. Thanks

Issue Analytics

  • State:closed
  • Created a year ago
  • Comments:9 (6 by maintainers)

github_iconTop GitHub Comments

1reaction
TuyenNguyenVancommented, Oct 8, 2021

Nice. Thank @Abhinandan-Kushwaha for quick support. Do you have a plan to do a combined chart? Maybe in next, I need show a line chart in bar chart. Anyway, give you a start

1reaction
Abhinandan-Kushwahacommented, Oct 7, 2021

Hi TuyenNguyenVan 👋 I have added the feature to add custom Y-axis text using the prop yAxisLabelText

This feature is available in version 0.1.7 🎉

Here’s an example -


import { BarChart } from "react-native-gifted-charts";
        
const App = () => {
    const barData = [
        {value: 250, label: 'M', yAxisLabelText: '$250'},
        {value: 500, label: 'T', frontColor: '#177AD5', yAxisLabelText: '$500'},
        {value: 745, label: 'W', frontColor: '#177AD5', yAxisLabelText: '$745'},
        {value: 320, label: 'T', yAxisLabelText: '$320'},
        {value: 600, label: 'F', frontColor: '#177AD5', yAxisLabelText: '$600'},
        {value: 256, label: 'S', yAxisLabelText: '$256'},
        {value: 300, label: 'S', yAxisLabelText: '$300'},
    ];
    return (
        <View>
            <BarChart
                barWidth={22}
                noOfSections={3}
                barBorderRadius={4}
                frontColor="lightgray"
                data={barData}
                yAxisThickness={0}
                xAxisThickness={0}
            />
        </View>
    );
};

Hope it helps. Closing the issue.

Read more comments on GitHub >

github_iconTop Results From Across the Web

yAxis.labels.formatter | highcharts API Reference
A format string for the axis label. The context is available as format string variables. For example, you can use {text} to insert...
Read more >
javascript - Format Highcharts y-axis labels
I'm using Highcharts to generate a line chart that shows currency values. By default the y-axis labels ...
Read more >
Formatting the Axis Labels
Example: Formatting Axis Labels. The following request generates a vertical line chart and makes the y-axis labels bold with a 12pt Bookman Old...
Read more >
Change axis labels in a chart
Right-click the category axis labels you want to format, and click Font. On the Font tab, choose the formatting options you want. On...
Read more >
How can i show YAxis label format in ["", "k", "M", "G", "T", "P ...
You don't need to use yAxis.labels.formatter and yAxisLeft.labels.format . Just set yAxis.type = "logarithmic" .
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found