How can I have tilted or sloped titles on the X axis?

« Back to message list

Enter your email address to get email updates on this topic. You can stop receiving updates by clicking the link in the update email messages.

Posted by Javier on 20th November 2012
That is:

How can i show the x axis names inclines, so the excessive length in the horizontal position make them pile?

Thank you in advance!

Posted by RGraph support on 20th November 2012

Are you talking about the labels running into each other? If so there's the option:


There is other solutions though - eg the Horizontal Bar chart:

And using carriage returns in your labels:
Posted by Javier on 20th November 2012
Thank you very much for your quickness.

I´ll try the text angle.

Some time ago, i tried to implement the carriage returns, but really i did´nt know how, as i retrieve the datas from a Mysql database.

You can use the code below, and works fine only changing the name of the mysql table name and fields names to yours... Is the simple way i found to implement rgraph to mysql, to my aplication (

In the rgrapfh misc documentation example, the datas are written one by one, by hand... I don´t now what to do near the end on the example code below, near or around:

chart.Set('chart.labels', <?php print($labels_string) ?>);

Thank you very much!



     * Change these to your own credentials
  require_once ("../includes/mysql.php");
  $db = new MySQL();*/
     $result = mysql_query("SELECT area, cantidad FROM ncsporarea WHERE cantidad > 0");
     if ($result) {
         $labels = array();
         $data = array();
         while ($row = mysql_fetch_assoc($result)) {
             $labels[] = $row["area"];
             $data[] = $row["cantidad"];

         // Now you can aggregate all the data into one string
         $data_string = "[" . join(", ", $data) . "]";
         $labels_string = "['" . join("', '", $labels) . "']";
     } else {
         print('MySQL query failed with error: ' . mysql_error());

     <!-- Don't forget to update these paths -->

     <script src="../libraries/RGraph.common.core.js" ></script>
     <script src="../libraries/"></script>
     <script src="../libraries/RGraph.common.dynamic.js"></script>
     <script src="../libraries/RGraph.common.context.js" ></script>
     <script src="../libraries/RGraph.common.tooltips.js"></script>
     <script src="../libraries/RGraph.common.annotate.js" ></script>
     <!--<script src="../libraries/RGraph.line.js" ></script>-->
  <script type="text/javascript" src="\"></script>
     <canvas id="cvs" width="800px" height="300px">[No canvas support]</canvas>
         chart = new RGraph.Bar('cvs', <?php print($data_string) ?>);
         chart.Set('chart.title', 'NC´s por área');
         chart.Set('chart.annotatable', true);
         chart.Set('chart.contextmenu', [
                                 ['Show palette', RGraph.Showpalette],
                                 ['Clear', function () {RGraph.Clear(bar.canvas); bar.Draw();}]
         chart.Set('chart.background.grid.autofit', true);
         chart.Set('chart.gutter.left', 35);
         chart.Set('chart.gutter.right', 5);
         chart.Set('chart.gutter.bottom', 60);
         chart.Set('chart.hmargin', 10);
         chart.Set('chart.tickmarks', 'endcircle');
         chart.Set('chart.tooltips', <?php print($labels_string) ?>);
         chart.Set('chart.labels', <?php print($labels_string) ?>);

Posted by Javier on 20th November 2012
I´m not selling the aplication still (hopefully!)

Posted by RGraph support on 20th November 2012


Add a reply

« Back to message list