youcef92 / flotr

Automatically exported from code.google.com/p/flotr
0 stars 0 forks source link

Flotr Playground Y Axis Title #185

Closed GoogleCodeExporter closed 8 years ago

GoogleCodeExporter commented 8 years ago
Hi In Flotr Playground 
(http://flotr.googlecode.com/svn/trunk/flotr/playground/index.html) site also 
the Y Axis Title is appearing in a Horizontal Way 

See the Image here http://www.tiikoni.com/tis/view/?id=c57a22f

Please tell me how to resolve this ??

Original issue reported on code.google.com by ravikira...@gmail.com on 12 May 2011 at 1:55

GoogleCodeExporter commented 8 years ago
There are two ways to achive this. First option is to use HtmlText set to true. 
If you have it set to false you need to specify titleAngle for yaxis to 0 
(default is 90).

Post here if that helped.

Original comment by macku30@gmail.com on 12 May 2011 at 4:36

GoogleCodeExporter commented 8 years ago
[deleted comment]
GoogleCodeExporter commented 8 years ago
This is my code , i tried either way , but still it doesn't work 

<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<script type="text/javascript" src="canvastext.js"></script>
<script type="text/javascript" src="prototype-1.6.0.2.js"></script>
<script type="text/javascript" src="flotr-0.2.0-alpha.js"></script>
<script type="text/javascript" src="flotr.debug-0.2.0-alpha.js"></script>
</script>

</head>

    <body>

        <div id="container" style="width:600px;height:300px;"></div>

        <script type="text/javascript">
            /**
             * Wait till dom's finished loading.
             */
            document.observe('dom:loaded', function(){
                /**
                 * Fill series d1 and d2.
                 */
                var d1 = [];
                for(var i = 0; i < 14; i += 0.5)
                    d1.push([i, Math.sin(i)]);

                var d2 = [[0, 3], [4, 8], [8, 5], [9, 13]];

                /**
                 * Draw the graph.
                 */

              var f = Flotr.draw($('container'), [ d2 ],
              {
                selection: {mode: 'x'},

yaxis:{
                title: 'y = f(x)',HTMLText:false,titleAngle:0
            },

                }
              );

            });         
        </script>

        <!-- analytics -->
    </body>
</html>

Please advice .

Original comment by ravikira...@gmail.com on 12 May 2011 at 7:54

GoogleCodeExporter commented 8 years ago
First of all, make sure you are using latest version from trunk, it is 
recomended (we need to make new release as soon as possible). 

Try this code then:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript" src="canvas2image.js"></script>
<script type="text/javascript" src="canvastext.js"></script>
<script type="text/javascript" src="prototype.js"></script>
<script type="text/javascript" src="flotr.js"></script>
</script>

</head>
    <body>
        <div id="container" style="width:600px;height:300px;"></div>

        <script type="text/javascript">
            /**
             * Wait till dom's finished loading.
             */
            document.observe('dom:loaded', function(){
                /**
                 * Fill series d1 and d2.
                 */
                var d1 = [];
                for(var i = 0; i < 14; i += 0.5)
                    d1.push([i, Math.sin(i)]);

                var d2 = [[0, 3], [4, 8], [8, 5], [9, 13]];

                /**
                 * Draw the graph.
                 */

                var f = Flotr.draw($('container'), [ d2 ],
                {
                    selection: {mode: 'x'},
                    HtmlText:false,
                    yaxis:{
                        title: 'y = f(x)',titleAngle:0
                    },
                });
            });         
        </script>
    </body>
</html>

Original comment by macku30@gmail.com on 12 May 2011 at 8:23

GoogleCodeExporter commented 8 years ago
Post here if that helped

Original comment by macku30@gmail.com on 12 May 2011 at 8:31

GoogleCodeExporter commented 8 years ago
Thanks for the reply , I took the flotr.js from 
http://code.google.com/p/flotr/source/browse/trunk/flotr/flotr/prototype/flotr.j
s?r=179    and ran your code but still this is the same 

Original comment by ravikira...@gmail.com on 13 May 2011 at 5:21

GoogleCodeExporter commented 8 years ago
Hmm, strange. I'm testing it and it works for me. Post here a graph you get 
using my code please.

Original comment by macku30@gmail.com on 13 May 2011 at 6:06

GoogleCodeExporter commented 8 years ago
Pay attention to the case of the Javascript : 

HTMLText:false

is not the same as 

HtmlText:false

Does this example work ? 
http://flotr.googlecode.com/svn/trunk/flotr/examples/prototype/advanced-titles.h
tml

Original comment by fabien.menager on 13 May 2011 at 6:23

GoogleCodeExporter commented 8 years ago
I ahve copy Pasted your code as it is and ran , see this is the Picture of the 
resultant Chart http://www.tiikoni.com/tis/view/?id=0e04a5d

Original comment by ravikira...@gmail.com on 13 May 2011 at 7:54

GoogleCodeExporter commented 8 years ago
Ok, I have not understand what you want, set titleAngle:90 and it should now 
work as you intended.

Original comment by macku30@gmail.com on 13 May 2011 at 7:58

GoogleCodeExporter commented 8 years ago
Is that what you want?

Original comment by macku30@gmail.com on 13 May 2011 at 8:58

GoogleCodeExporter commented 8 years ago
Thank you very much for your suppourt , i am using this chart developed using 
Flotr http://www.humblesoftware.com/finance/index   , But in that Chart , the Y 
axis  Title is not coming as intended .The author is using this version only ,  
var Flotr = {
    version: '%version%',
    author: 'Bas Wenneker',
    website: 'http://www.solutoire.com'

and this example worked for me 
(http://flotr.googlecode.com/svn/trunk/flotr/examples/prototype/advanced-titles.
html) ,but i cant make it to happen in this above mentioned charts (and i cant 
chnage the Flotr Version as it chnages the whole functionality ) so is it 
possible to apply this chnage in the earlier version of Flotr ?? 

Original comment by ravikira...@gmail.com on 13 May 2011 at 10:51

GoogleCodeExporter commented 8 years ago
This has been solved when i took the later version of the Flotr JS . Thank you 
. 

Original comment by ravikira...@gmail.com on 15 May 2011 at 1:07

GoogleCodeExporter commented 8 years ago

Original comment by macku30@gmail.com on 16 May 2011 at 5:43