Topic: Format as currency in chart tooltip values

pepe0217 free asked 9 years ago


Hello is there a way to format the chart tooltips to display currency format, currenty is displaying this value 3948442.86791 and it's hard to read.

pepe0217 free answered 8 years ago


i see, please download numeraljs file from here, this is js libary to format numbers, currency, etc. http://numeraljs.com/

tunicko free answered 8 years ago


can you share the script on this line ? numeral.min.js thx

pepe0217 free answered 8 years ago


It should work same, remove this line: @section Scripts{ change for <script type="text/javascript"> //code goes here <script src=”~/Scripts/numeral/numeral.min.js”></script> .. .. .. </script> and also remove the last } (braket)

tunicko free answered 8 years ago


how if i use PHP ?

pepe0217 free answered 8 years ago


Hi i suggest you make sure numeral JS is well configured in your project, make some side test and then try with the charts, here is a more complete example made in ASP .Net MVC Razor: <canvas id="chart6"></canvas> @section Scripts{ <script src="~/Scripts/numeral/numeral.min.js"></script> $(document).ready(function () { var Class = { labels: {''}, //define your labels here datasets: [ { label: "My First dataset", fillColor: "rgba(159, 168, 218,0.2)", strokeColor: "rgba(140, 158, 255,1)", pointColor: "rgba(151,187,205,1)", pointStrokeColor: "#fff", pointHighlightFill: "#fff", pointHighlightStroke: "rgba(151,187,205,1)", data: {}//data to plot goes here } ] }; var option = { responsive: true, tooltipTemplate: "<%if (label){%><%=label%>: <%}%><%=numeral(value).format('$0,0.00')+' USD'%>" }; var ctx = document.getElementById("chart6").getContext('2d'); var myLineChart6 = new Chart(ctx).Bar(Class, option); } }

tunicko free answered 8 years ago


Found a way using numeral JS var option = { responsive: true, tooltipTemplate: “<%if (label){%><%=label%>: <%}%><%=numeral(value).format(‘$0,0.00’) %>” };
i try this. but did't working ? any solution ?

Marta Wierzbicka free answered 9 years ago


Hello, I'm glad you found a solution and share it with the others. Best, Marta

pepe0217 free answered 9 years ago


Found a way using numeral JS var option = { responsive: true, tooltipTemplate: "<%if (label){%><%=label%>: <%}%><%=numeral(value).format('$0,0.00') %>" };

Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Specification of the issue

  • ForumUser: Free
  • Premium support: No
  • Technology: General Bootstrap questions
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No