Comments (10)
Yes,
For the individual axis elements use d3.format and a formatFunction to format the percentage.
https://github.com/mbostock/d3/wiki/Formatting#wiki-d3_format
percentage ("%") - like fixed, but multiply by 100 and suffix with "%".
For the overall axis label there are a couple of attributes that handle that, xAxisLabel, yAxisLabel.
Post to plnkr (or something else), if you need help.
Chris
from angularjs-nvd3-directives.
Am I doing this wrong? The chart is showing up nicely except for the formatting of the y-axis labels.
$scope.yAxisLabelFunction = () ->
d3.format('%')
yaxislabel="yAxisLabelFunction()"
from angularjs-nvd3-directives.
Are you trying to format a value, or are you trying to show a '%' sign?
If you are trying to format a data value you need to do something like the following:
$scope.yAxisLabelFunction = function(){
return function(d){
return d3.format('%')(d);
}
}
If you are trying to show a '%' sign, just return the '%' sign.
from angularjs-nvd3-directives.
I'm trying to format the labels of the y-axis. For example, in the first graph on this page: http://cmaurer.github.io/angularjs-nvd3-directives/multi.bar.chart.html
I want 9.3 to be a percentage with the % symbol and without the decimal.
from angularjs-nvd3-directives.
Ok, thats what I thought. Give me a sec.
from angularjs-nvd3-directives.
Try this.
$scope.yAxisFormatFunction = function(){
return function(d){
return d3.format('%')(d);
}
}
<div ng-controller="ExampleCtrl">
<nvd3-multi-bar-chart
data="exampleData"
showYAxis="true"
id="exampleId"
yAxisTickFormat="yAxisFormatFunction()">
<svg></svg>
</nvd3-multi-bar-chart>
</div>
from angularjs-nvd3-directives.
Hey Chris! That worked! Thank you very much!
from angularjs-nvd3-directives.
No problem. Glad you got it going.
Chris
from angularjs-nvd3-directives.
how to display values(x,y) on the line chart graph using NVD3.. directly on the line chart i need to display ?? if possible reply me ...
from angularjs-nvd3-directives.
Its straight forward
add
.showValues(true)
in you code
from angularjs-nvd3-directives.
Related Issues (20)
- how to i18n
- Custom data field names for sunburst..?
- How to achieve horizontal interactive guide line in nvd3 charts
- Need a vertical scroll in multiBarHorizontalChart if no. of bars increases
- How to i get data when iam click on pie chart HOT 2
- Discretebar Chart HOT 1
- Is there a way to save the graph and/or all its data to an xml or xmls ?
- TypeError: nv.dispatch.render_start is not a function HOT 2
- Pie Chart Label Lines with angular-nvd3
- Cannot read property 'disabled' of undefined
- Wrap long axis labels
- TypeError: nv.dispatch.render_start is not a function HOT 1
- Tooltip Not Hide while clicking outside of chart element in IPAD Devices
- Gradient color
- Format of focus chart x axis in "lineWithFocusChart" HOT 2
- Interactive Guideline Not showing on all the data points
- Fixed Labels on xAxis
- When selecting/deselecting legends with multi lines on line chart the lines start showing incorrect colors
- Cannot output data to another component using angular 2 custom event @Output()
- Discrete Bar chart tooltip customize
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from angularjs-nvd3-directives.