2

We get data from multiple feeds and data may or may not exist for a certain date. So, for points that have no data we send NaN.

Question: In the below code , is there a way to not show datatip for those that are null. I have added a datatip function but it does show a small empty square, is it possible to not even show that?

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
  <mx:Script><![CDATA[
    import mx.charts.HitData;
     import mx.collections.ArrayCollection;

     [Bindable]
      public var DS:ArrayCollection = new ArrayCollection([
        {date:"22-Aug-05", expense:1575.9, tax:41.87, price: 4},
        {date:"23-Aug-05", expense:NaN, tax:NaN,price: 4},
        {date:"24-Aug-05", expense:1507.1, tax:42.77,price:5 },
        {date:"25-Aug-05", expense:1568.8 ,tax:48.06, price:5},
     ]);

     public function dtFunc(hd:HitData):String {
        if(""+hd.item.expense == "NaN")
            return "";
        else 
            return hd.item.expense ;
     }



  ]]></mx:Script>

    <mx:SolidColor id="sc1" color="blue" alpha=".8"/>
    <mx:Stroke id="s1" color="blue" weight="1"/>


  <mx:Panel title="Column Chart With Multiple Axes">
     <mx:CartesianChart id="myChart" showDataTips="true" dataTipFunction="dtFunc">
        <mx:horizontalAxis>
           <mx:CategoryAxis id="h1" categoryField="date"/>
        </mx:horizontalAxis>

        <mx:horizontalAxisRenderers>
            <mx:AxisRenderer placement="bottom" axis="{h1}"/>
        </mx:horizontalAxisRenderers>

        <mx:verticalAxisRenderers>
            <mx:AxisRenderer placement="left" axis="{v1}"/>
            <mx:AxisRenderer placement="left" axis="{v3}" visible="false"/>
        </mx:verticalAxisRenderers>

        <mx:series>
           <mx:ColumnSeries id="cs1" 
                horizontalAxis="{h1}" 
                dataProvider="{DS}" 
                yField="expense" 
                displayName="EXPENSE-BARCHART"
                filterData="false"
            >
                <mx:verticalAxis>
                   <mx:LinearAxis id="v1" />
                </mx:verticalAxis>           
           </mx:ColumnSeries>           


           <mx:LineSeries id="cs3" horizontalAxis="{h1}" dataProvider="{DS}" yField="price" 
            displayName="Price" form="step"
            >
                <mx:verticalAxis>
                    <mx:LinearAxis id="v3"   />           
                </mx:verticalAxis>

           </mx:LineSeries>
        </mx:series>
     </mx:CartesianChart>
     <mx:Legend dataProvider="{myChart}"/>
  </mx:Panel>
</mx:Application>
Shah Al
  • 346
  • 2
  • 4
  • 17
  • I found a link, http://help.adobe.com/en_US/flex/using/WS2db454920e96a9e51e63e3d11c0bf65c3d-7fff.html . Search for aspexamples.adobe.com/chart_examples/stocks.aspx, there is a button below "View Running example" . the example has a "no-data" condition and the datatip does not come up. Problem: The example uses DateTimeAxis and I cannot use that because sometimes my x-axis has values like jan , feb , mar etc.... So, what in DateTimeAxis allows no datatip condition ? – Shah Al Oct 06 '10 at 19:39
  • I wanted to say that my x-axis have values that are other than dates and hence I cannot use DateTimeAxis . – Shah Al Oct 06 '10 at 19:45
  • Couldn't figure out how to link this question to another question but I found my answer over at http://stackoverflow.com/questions/884123/flex-charting-only-display-datatip-for-specific-series even though I found this answer first. Short answer is there's a property on the series called "interactive" that controls this functionality exactly as desired. – buddyp450 Jan 08 '15 at 17:37

2 Answers2

1

Thank you Devtron, the http://www.flexdeveloper.eu/forums/flex-charting/disable-datatip-but-keep-mouse-event-on-line-chart/

correctly describes the solution.

You can also set myChart.setStyle("dataTipRenderer",mx.skins.ProgrammaticSkin); to get rid of the display of datatips.

Two minor issues,

  • We need to know the value of the tip before clearing the graphics.
  • The line that connects the datapoint to the rectangle that displays the data could not be removed. But that is good enough for me.
Shah Al
  • 346
  • 2
  • 4
  • 17
0

My guess is that you would have to extend the classes for DataTip, to check for NULL hitData objects, to kill/stop the drawing of the display.

I do not think there is a way to do that normally in FLEX. You would have to customize and override the hitData class unfortunately. What a pain!!

D3vtr0n
  • 2,774
  • 3
  • 33
  • 53
  • Thank you will check it out, but there is an example listed above that has this out of the box for DateTimeAxis , unfortunately my x-axis is not datetime. Something in datetime axis facilitates this, need to figure out the internals. – Shah Al Oct 06 '10 at 19:48
  • I am not sure if this would help you or not: http://www.flexdeveloper.eu/forums/flex-charting/disable-datatip-but-keep-mouse-event-on-line-chart/ – D3vtr0n Oct 07 '10 at 14:55
  • Also, here is an example of extending a datagrid and manipulating the datatip. You may want to try something similar to this: http://whatsmytitletoday.blogspot.com/2008/11/advanceddatagrid-datatipfunction-mess.html – D3vtr0n Oct 07 '10 at 15:10
  • thank you, will check on these ... I think the flexdeveloper link is more relevant than the other, I will try that first and then post the results. – Shah Al Oct 11 '10 at 01:19
  • I have almost similar problem but not to close, I also wanted to hide the tooltip if what is return in the dataTipsFunction is empty or null, how can i do that? thanks – She Smile GM Jan 24 '14 at 03:27