amCharts support forum

You are not logged in.

Announcement

FORUM CLOSED! This forum is closed. We moved to a new place at Zendesk. Update your bookmarks.

Flash Charts: Flash Charts Bundle


Pages: 1

 

#1 2012-07-13 04:47:07

ganesh
Member

Not able to get title for valueaxis when position="left" is used

I am using AMcharts flex version and i am not able to get title for valueaxis when position="left" is used

<amcharts:ValueAxis  title="X"  position="bottom" inside="false" tickLength="5"
                                    labelsEnabled="true" gridAlpha="0"/>
       
<amcharts:ValueAxis title="Y" position="left"
                                inside="false" tickLength="5" labelsEnabled="true" gridAlpha="0"/>

X appears correctly but not Y
could you please help

Offline

 

#2 2012-07-13 05:25:24

martynasma
Administrator

Re: Not able to get title for valueaxis when position="left" is used

You may need to increase the left margin for the chart as the value title might be off chart area.

Offline

 

#3 2012-07-13 07:12:17

ganesh
Member

Re: Not able to get title for valueaxis when position="left" is used

I have already tried that option and that is not working.
Anyway i have just set title as string literal "Y" and have kept enough margin. but it is not working out.

Offline

 

#4 2012-07-15 08:05:09

martynasma
Administrator

Re: Not able to get title for valueaxis when position="left" is used

I didn't mention it but for explicit margins to work you need to disable autoMargins:

Code:

chart.autoMargins = false;
chart.marginLeft = 80;

Offline

 

#5 2012-07-15 23:32:44

ganesh
Member

Re: Not able to get title for valueaxis when position="left" is used

when i tried your option, both x and y axis title does not appear correctly and valueaxis at bottom is also not displayed correctly.

below is my full code on same, could you please help.

--

<s:VGroup width="100%" height="100%">
   
<amcharts:AmXYChart id="chart" x="0" y="0" width="100%" height="100%" autoMargins="true"
                        marginBottom="10" marginLeft="50" marginRight="30" marginTop="50">
<amcharts:graphs>
<amcharts:AmGraph               width="80%"
                height="80%"
                lineColor="red"
                xField="x"
                yField="y"
                valueField="value"
                lineAlpha="0"
                bullet="bubble"
                balloonText="x:[[x]] y:[[y]] value:[[value]]"
                includeInMinMax="true"
                title="AMGraph"
                />
<amcharts:AmGraph       
                width="80%"
                height="80%"
                lineColor="blue"
                xField="y"
                yField="x"
                valueField="value"
                lineAlpha="0"
                bullet="bubble"
                balloonText="x:[[x]] y:[[y]] value:[[value]]"
                includeInMinMax="true"
                title="AMGraph"
                />

               
        </amcharts:graphs>
       
       
<amcharts:valueAxes>
<amcharts:ValueAxis  title="X"  position="bottom" inside="false" tickLength="5"
                                labelsEnabled="true" gridAlpha="0"/>
<amcharts:ValueAxis  title="Y"  position="left"
                                inside="false" tickLength="5" labelsEnabled="true" gridAlpha="0"/>
        </amcharts:valueAxes>

<amcharts:chartCursor>
           
<amcharts:ChartCursor>                   
           
</amcharts:ChartCursor>
</amcharts:chartCursor>   
       
       
       
    </amcharts:AmXYChart>

    <amcharts:AmLegend dataProvider="{chart}" width="100%" marginRight="20"
                       marginLeft="40" textClickEnabled="false" marginBottom="5"
        labelText="{bndXAxisTitle} vs {bndYAxisTitle}"    switchType="v" switchColor="blue"   />

    </s:VGroup>

Offline

 

#6 2012-07-16 13:52:31

martynasma
Administrator

Re: Not able to get title for valueaxis when position="left" is used

Can you post your whole app which we can run and test?

Offline

 

#7 2012-07-17 07:55:51

ganesh
Member

Re: Not able to get title for valueaxis when position="left" is used

please see the whole app and let me know your comments

------

<?xml version="1.0" encoding="utf-8"?>

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx"
               xmlns:chartClasses="com.amcharts.chartClasses.*"
               xmlns:com_internal="http://www.amcharts.com/com_internal"
               xmlns:utils="com.amcharts.utils.*"
               xmlns:layout="com.amcharts.layout.*"
               xmlns:data="services.data.*"
               xmlns:amcharts="http://www.amcharts.com/com_internal"
               xmlns:display="flash.display.*"
               xmlns:local="*"
               width="100%" height="100%"
               creationComplete = "init()" xmlns:amcharts1="com.amcharts.*">
    <s:layout>
        <s:BasicLayout/>
    </s:layout>
    <fx:Script>
        <![CDATA[
            import com.amcharts.AmXYChart;
            import com.amcharts.amcharts_com_internal;
            import com.amcharts.axes.ValueAxis;
            import com.amcharts.chartClasses.AmChart;
            import com.amcharts.chartClasses.AmCoordinateChart;
            import com.amcharts.chartClasses.AmGraph;
            import com.amcharts.chartClasses.AmRectangularChart;
            import com.amcharts.chartClasses.ChartCursor;
            import com.amcharts.events.AmChartEvent;
           
            import flashx.textLayout.formats.Float;
           
            import mx.binding.utils.BindingUtils;
            import mx.collections.ArrayCollection;
            import mx.collections.ArrayList;
            import mx.collections.ListCollectionView;
            import mx.containers.HBox;
            import mx.controls.Alert;
            import mx.controls.Image;
            import mx.controls.Label;
            import mx.controls.List;
            import mx.events.FlexEvent;
            import mx.events.ListEvent;
            import mx.graphics.ImageSnapshot;
            import mx.graphics.codec.*;
            import mx.graphics.codec.JPEGEncoder;
            import mx.graphics.codec.PNGEncoder;
            import mx.managers.CursorManager;
            import mx.messaging.ChannelSet;
            import mx.messaging.channels.AMFChannel;
            import mx.messaging.channels.HTTPChannel;
            import mx.rpc.events.FaultEvent;
            import mx.rpc.events.ResultEvent;
            import mx.states.AddChild;
            import mx.utils.Base64Decoder;
            import mx.utils.ObjectProxy;
            import mx.utils.ObjectUtil;
           
            import spark.components.supportClasses.ItemRenderer;
           
            public var XAxisTitle:String;
            public var YAxisTitle:String;
           
            [Bindable]
            private var bndXAxisTitle:String;
           
            [Bindable]
            private var bndYAxisTitle:String;
           
            public var ChartData:ArrayCollection = new ArrayCollection();
           
           
           
           
            private function init():void
            {
                var amfchannel:AMFChannel;
                var channelset:ChannelSet;
               
                try
                {
                    amfchannel =  new AMFChannel();
                    channelset = new ChannelSet();
                    amfchannel.url="http://127.0.0.1:8888/messagebroker/amf";     // Jetty server
                    channelset.addChannel(amfchannel);
                    remoteService.channelSet = channelset;
                   
                }
                catch(error:Error)
                {
                    Alert.show(" here in error "+error.message);
                }
               
                remoteService.getGraphData();
           
                //Alert.show("call");
               
               
            }
           
            private function handleResult(event:ResultEvent):void
            {

                //Alert.show("1");
               
                var graphData:GraphData= event.result as GraphData;
               
                var graphLabel:GraphLabel = graphData.graphLabel ;
               
                //Alert.show(graphLabel.yAxisTitle);
                   
                var data:ArrayCollection  = graphData.xypoints as ArrayCollection;
                               
                var pointsCount:Number = data.length;

                for(var count:Number= 0;count < pointsCount ;count++)
                {
                    var xyPoints:XYPoints  = data.getItemAt(count) as XYPoints;
                    var XYValue:Object = new Object();
                    XYValue["x"] =xyPoints.x;
                    XYValue["y"] =xyPoints.y;
                   
                   
               
                   
                    ChartData.addItem(XYValue);
                }
                YAxisTitle = graphLabel.yAxisTitle;
                XAxisTitle = graphLabel.xAxisTitle;
                bndXAxisTitle = XAxisTitle;
                bndYAxisTitle = YAxisTitle;
               
               
               
               
               
                chart.dataProvider  = ChartData;
               
               
               
            }
           
           
           
           
            private function handleFault(event:FaultEvent):void
            {
                Alert.show(event.fault.faultDetail.toString() + event.fault.faultString.toString()  );
            }
           
           
           
           
        ]]>
    </fx:Script>
   
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
        <mx:RemoteObject id="remoteService"
                         showBusyCursor="true"
                         destination="GraphDataDestination"
                         fault="handleFault(event)"
                         result="handleResult(event)"/>

               
    </fx:Declarations>

    <s:VGroup width="100%" height="100%">
       
       
           
       
               
        <amcharts:AmXYChart id="chart" x="0" y="0" width="100%" height="100%" autoMargins="true"
                        marginBottom="10" marginLeft="10" marginRight="30" marginTop="50">
        <amcharts:graphs>
            <!-- bubble graph -->
            <!--lineAlpha is line connector between 2 points-->
            <!-- chartcursor is for selecting and zooming purposes
            chartscrollBar is for scrolling purposes
            gridAlpha is for background grid
            balloonText is one which will appear when cursor is placed over points in charts -->
           

            <amcharts:AmGraph       
                width="80%"
                height="80%"
                lineColor="red"
                xField="x"
                yField="y"
                valueField="value"
                lineAlpha="0"
                bullet="bubble"
                balloonText="x:[[x]] y:[[y]] value:[[value]]"
                includeInMinMax="true"
                title="AMGraph"
                />

           
           
           
               
        </amcharts:graphs>
       
       
       
        <amcharts:valueAxes>
            <amcharts:ValueAxis  title="{bndXAxisTitle}"  position="bottom" inside="false" tickLength="5"
                                    labelsEnabled="true" gridAlpha="0" titleTextColor="#CC0000"/>
       
            <amcharts:ValueAxis  title="{bndYAxisTitle}"  position="left" titleTextColor="#CC0000"
                        inside="false" tickLength="5" labelsEnabled="true" gridAlpha="0"/>
        </amcharts:valueAxes>

        <amcharts:chartCursor>
            <amcharts:ChartCursor>                   
            </amcharts:ChartCursor>
        </amcharts:chartCursor>   
       
       
       
    </amcharts:AmXYChart>

   
           
       
       
    </s:VGroup>
   
   
   
</s:Application>

Offline

 

#8 2012-07-18 00:18:28

martynasma
Administrator

Re: Not able to get title for valueaxis when position="left" is used

I'm getting the following errors when trying to compile your app. It's probably missing some external code:

http://extra.amcharts.com/images/Screenshot-2012-07-18_08.17.09.png

Could you please export and email your whole app directly to us at info@amcharts.com? Please mention this thread in your email so we know what's it about.

Offline

 

#9 2012-07-20 04:03:04

ganesh
Member

Re: Not able to get title for valueaxis when position="left" is used

This is an example taken from amcharts website itself. I have added just title for x and y axis, you may test this and let me know.

--------------------------------------------

<?xml version="1.0" encoding="utf-8" ?>

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:amcharts="http://www.amcharts.com/com_internal" backgroundColor="#FFFFFF" width="100%" height="100%" viewSourceURL="srcview/index.html">
       <fx:Script>
             <![CDATA[
                import mx.collections.ArrayCollection;
               
                [Bindable]
                private var chartData:ArrayCollection = new ArrayCollection([
                    // scatter points           
                    {ax:1, ay:0.5, bx:1, by:2.2},
                    {ax:2, ay:1.3, bx:2, by:4.9},
                    {ax:3, ay:2.3, bx:3, by:5.1},
                    {ax:4, ay:2.8, bx:4, by:5.3},
                    {ax:5, ay:3.5, bx:5, by:6.1},
                    {ax:6, ay:5.1, bx:6, by:8.3},
                    {ax:7, ay:6.7, bx:7, by:10.5},
                    {ax:8, ay:8.0, bx:8, by:12.3},
                    {ax:9, ay:8.9, bx:9, by:14.5},
                    {ax:10, ay:9.7, bx:10, by:15.0},
                    {ax:11, ay:10.4, bx:11, by:18.8},
                    {ax:12, ay:11.7, bx:12, by:19.0},
                    // trend graphs
                    {agx:12, agy:11, bgx:12, bgy:19},
                    {agx:1, agy:1, bgx:1, bgy:2}           
                ]);   
               
               
            ]]>
        </fx:Script>
       <amcharts:AmXYChart width="100%" height="100%" id="chart" dataProvider="{chartData}" startDuration="1"
                           marginBottom="10" marginLeft="50" marginRight="30" marginTop="50">
             <amcharts:graphs>
                  <amcharts:AmGraph balloonText="x:[[x]] y:[[y]]" xField="ax" yField="ay" lineAlpha="0" bullet="triangleDown" />
                  <amcharts:AmGraph balloonText="x:[[x]] y:[[y]]" xField="bx" yField="by" lineAlpha="0" bullet="square" />
                  <amcharts:AmGraph balloonText="x:[[x]] y:[[y]]" xField="agx" yField="agy" lineThickness="2" lineColor="0xFF6600" />
                  <amcharts:AmGraph balloonText="x:[[x]] y:[[y]]" xField="bgx" yField="bgy" lineThickness="2" lineColor="0xFCD202" />
              </amcharts:graphs>
             <amcharts:valueAxes>
                  <amcharts:ValueAxis title="YAxis" position="left" gridCount="20" labelFrequency="2" />
                  <amcharts:ValueAxis title="XAxis"  position="bottom" gridCount="20" />
              </amcharts:valueAxes>
             <amcharts:chartCursor>
                  <amcharts:ChartCursor />
              </amcharts:chartCursor>
             <amcharts:chartScrollbar>
                  <amcharts:ChartScrollbar height="20" />
              </amcharts:chartScrollbar>
        </amcharts:AmXYChart>
  </s:Application>

Offline

 

#10 2012-07-21 02:01:25

martynasma
Administrator

Re: Not able to get title for valueaxis when position="left" is used

To show a rotated text you need to embed the fonts. I.e.:

Code:

<fx:Style> 
        @font-face 
        {
            src: url("../assets/tahoma.ttf");
            fontFamily: "Tahoma";
            embedAsCFF: false;
            unicode-range:
                U+0020-U+0040, /* Punctuation, Numbers */
                U+0041-U+005A, /* Upper-Case A-Z */
                U+005B-U+0060, /* Punctuation and Symbols */
                U+0061-U+007A, /* Lower-Case a-z */
                U+007B-U+007E; /* Punctuation and Symbols */            
        }  
        
        .MyTextStyle 
        { 
            font-family: Tahoma; 
        }
        
    </fx:Style>

Offline

 

#11 2012-07-24 23:43:58

ganesh
Member

Re: Not able to get title for valueaxis when position="left" is used

Issue is Y axis label not appearing at all and not whether it is shown as rotation, even i tried your fx:style for my value axis it is not still appearing.

please understand that core issue value axis  <amcharts:ValueAxis title="YAxis" position="left" gridCount="20" labelFrequency="2" /> title in above example code taken from your website is not appearing at all.

Offline

 

#12 2012-07-26 01:03:55

martynasma
Administrator

Re: Not able to get title for valueaxis when position="left" is used

You also need to make your chart use the "MyTextStyle":

<amcharts:AmXYChart ... styleName="MyTextStyle">

Offline

 

#13 2012-07-31 23:37:42

ganesh
Member

Re: Not able to get title for valueaxis when position="left" is used

I have also tried same. Hope you can get what I am trying to say. when we use valueaxis with title with position=left, title does not appear at all.
<amcharts:ValueAxis title="YAxis" position="left" gridCount="20" labelFrequency="2" />

you could take example code from amcharts website itself for sample AMXYchart.

Offline

 

#14 2012-07-31 23:42:59

ganesh
Member

Re: Not able to get title for valueaxis when position="left" is used

Sorry, I applied stylename as suggested <amcharts:AmXYChart ... styleName="MyTextStyle"> and problem is resolved.
Thanks very much.

Offline

 

 

Pages: 1

© amCharts | Forum engine: PunBB