CODEWITHSUNDEEP
javascriptd3.jsformattingapache-superset
ah1
ah1

Reputation: 71

Formatting a number as a percentage in d3.js for Superset

I'm currently using Superset and trying to format the y-axis of a graph to show the number as a percentage.

Values are 0.7, 0.75, 0.9, 1.2, 1.21 and so on.

I'm looking to format these as 0.70%, 0.75%, 0.90%, 1.20%, 1.21% etc. I'm having trouble formatting it in this way. When I use the '.2%' it returns two decimal places, ie. 1.21 turns into 121.00%. Using ',0.01' will return 1.2, 1.21 etc but when adding the percentage to the end, it doesn't show it - also, it doesn't add the second decimal place when it doesn't exist.

Anyone know how to format 2 point decimal places in d3 (specifically for superset, which will only take a string rather than code)

Upvotes: 4

Views: 11078

Answers (2)

Shyam
Shyam

Reputation: 5497

In the column tab of edit table in superset you can add a new column of type float , in the sql expression you can give (column_name)/100. so 0.70 will now become 0.0070 , now you can apply for .2% in the y-axis format .

You can check it here , try just giving the string alone

http://koaning.io/d3-format-tutorial.html

Upvotes: 5

Gerardo Furtado
Gerardo Furtado

Reputation: 102174

Why don't you simply concatenate them with the string "%"?

var numbers = [0.7, 0.75, 0.9, 1.2, 1.21];
var format = d3.format(".2f")
numbers.forEach(function(d){
    console.log(format(d)+ "%")
})
<script src="https://d3js.org/d3.v4.min.js"></script>

Upvotes: 1

Related Questions