javascript - how to show $ sign in graph values in HTML web page -
i creating graph working fine want values shows above bar graphs should have $ values idea how add dollar sign values.
here image of graph want should show $17 , values comes.
here html code
<!doctype html> <html> <head> <title>graph 2</title> <script type="text/javascript" src="jquery-1.7.2.min.js"></script> <script type="text/javascript" src="graph_script.js"></script> </head> <body> <div id="container" style=" height:285px; width:400px;float:left;margin:200px 0 0 335px; position:absolute;"> </div> <script type="text/javascript"> $(document).ready(function(){ var b; b=17; bb=17.60; cc=21; a=10; var n=$; var chart = new highcharts.chart({ chart: { renderto: 'container', defaultseriestype: 'column' }, xaxis: { categories: [''], title: { text: '', style: { color: '#767575' }} , labels: { align: 'right', style: { font: 'normal 11px verdana' }, x: 34, } }, yaxis: { min: 0, startontick: false, labels: { formatter: function() { return this.value + '%'; }, style: { color: '#767575' } }, title: { text: 'prevalence rate %', style: { color: '#767575' } } }, plotoptions: { column: { datalabels: { enabled: true } } }, series: [{ name: 'prevalence rate %', data: [b] }, { name: 'prevalence rate %', data: [bb] },{ name: 'prevalence rate %', data: [cc] },{ name: 'prevalence rate %', data: [a] }] });}); </script> </form> </body> </html>
and here link of graph_script.js
you can add formatter series so:
plotoptions: { column: { datalabels: { enabled: true, formatter: function() { return '$' + this.y ; } } } },
update : entire code should this;
<!doctype html> <html> <head> <title>graph 2</title> <script type="text/javascript" src="jquery-1.7.2.min.js"></script> <script type="text/javascript" src="graph_script.js"></script> </head> <body> <div id="container" style=" height:285px; width:400px;float:left;margin:200px 0 0 335px; position:absolute;"></div> <script type="text/javascript"> $(document).ready(function(){ var b; b=17; bb=17.60; cc=21; a=10; var n=$; var chart = new highcharts.chart( { chart: { renderto: 'container', defaultseriestype: 'column' }, xaxis: { categories: [''], title: { text: '', style: { color: '#767575' }}, labels: { align: 'right', style: { font: 'normal 11px verdana' }, x: 34, }}, yaxis: { min: 0, startontick: false, labels: { formatter: function() { return this.value + '%'; }, style: { color: '#767575' }}, title: { text: 'prevalence rate %', style: { color: '#767575' }}}, plotoptions: { column: { datalabels: { enabled: true, formatter: function() { return '$' + this.y ; } } } }, series: [ {name: 'prevalence rate %', data: [b]}, {name: 'prevalence rate %', data: [bb]}, {name: 'prevalence rate %', data: [cc]}, {name: 'prevalence rate %', data: [a]} ] }); }); </script> </body> </html>
Comments
Post a Comment