function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
AnimeLoverAnimeLover 

Google chart not showing complete data on x axis

Hi friends 
I have created the Google chart and I am using in my Visualforce age
and passing data from m visualforce page apex controller
but on the x-axis of the chart below some bar data is not showing completely 
User-added image
can you please tell me what is the issue here and how can i fix this

Thank you
 
SwethaSwetha (Salesforce Developers) 
HI, Have you tried the approach mentioned in https://stackoverflow.com/questions/15935459/google-chart-values-on-x-axis-not-showing-properly ? Thanks
AnimeLoverAnimeLover
Hii Swetha thanks for your comment 
I tried this but no use 
here is my chart code  
<apex:includeScript id="a" value="https://www.google.com/jsapi" />
        <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
        <script type="text/javascript">
            google.charts.load('current', {'packages':['bar']});
        google.charts.setOnLoadCallback(drawChart);        
        //Strike chart
        function drawChart() {
            var data = google.visualization.arrayToDataTable({! dataList});
            console.log("{!rangeList}",{!rangeList}); //rangeList contains 410,429,430,450....
            var options = {
                chart: {
                    title: 'Strike Price',
                    subtitle: 'Graph to show Strike Price Rates',
                },
                bars: 'vertical',
                bar: { groupWidth: "25%" },
                hAxis: {showTextEvery: 10},
                hAxis: {
                    viewWindow: {
                        max: 1000
                    },
                    ticks: {!rangeList}
                },
                
                vAxis: {format: 'decimal'},
                hAxis: {format: 'decimal'},
                height: 700,
                colors: ['#1aa110', '#f0250e',]
                         };
                         
                         var chart = new google.charts.Bar(document.getElementById('chart_div'));
                         chart.draw(data, google.charts.Bar.convertOptions(options));
                         }
         
        </script>

 
SwethaSwetha (Salesforce Developers) 
HI, Taking a look at this thread, https://github.com/google/google-visualization-issues/issues/2693 , it appears to be an issue with the version of google.charts.load. Can you try to specify google.charts.load's 'current' parameter to version '45' in your code and if it still doesn't fix, it could be an issue with increased font size of the labels for which you need to specify relavant hAxis.textStyle.fontSize
 
Hope this helps you. Please mark this answer as best so that others facing the same issue will find this information useful. Thank you