1 Reply Latest reply on Jan 4, 2012 8:45 AM by EricJ32

    Data tip remains even when chart is no longer visible

    EricJ32 Level 1

      I have a chart with data tips which, when clicked, disappears and is replaced with a page of data (using a viewstack).

       

      My issue is, when the user hovers over a chart segment, they see the data tip and if they then click and keep the mouse in the same position, the data tip stays visible, even though the viewstack had changed view and is no longer showing the chart.

      Any idea how I can "kill" the data tip? I can't simply turn off data tips on the click event, because the user is able to navigate back to the pie chart. I just want to destroy all currently viisble tips.

       

      Thanks

        • 1. Re: Data tip remains even when chart is no longer visible
          EricJ32 Level 1

          To expand on this, the behavior isn't evident unless there's an effect added to the showing/hiding of viewstack children.

          The code below will demonstrate this behavior. Just click on the pie chart and it'll navigate to show the second content pane, with the datatip still visible until the mouse is moved.

           

          If the showEffect and hideEffect are removed from the NavigatorContents, then the datatip hides as expected.

           

          Similarly, if show and hide event handlers are added to the two viewstack children, even without the dissolve effect, the same thing happens.

           

          <fx:Declarations>

               <s:ArrayCollection id="dp">

                    <fx:Object Amount="10" />

                    <fx:Object Amount="20" />

                    <fx:Object Amount="30" />

                    <fx:Object Amount="40" />

               </s:ArrayCollection>

           

               <s:Fade id="dissolveOut"

                         duration="1000"

                         alphaTo="0"/>

           

               <s:Fade id="dissolveIn"

                         duration="1000"

                         alphaTo="1"/>

           

          </fx:Declarations>

           

          <mx:ViewStack id="vs" width="100%" height="100%">

           

               <s:NavigatorContent

                    width="100%" height="100%"

                    showEffect="{dissolveIn}"

                    hideEffect="{dissolveOut}">

           

                    <mx:PieChart id="pieChart"

                                        width="300" height="300"

                                        dataProvider="{dp}"

                                        showDataTips="true"

                                        click="{vs.selectedIndex = 1}">

                         <mx:series>

                              <mx:PieSeries id="pieSeries" field="Amount" />

                         </mx:series>

                    </mx:PieChart>

           

               </s:NavigatorContent>

           

               <s:NavigatorContent

                         width="100%" height="100%"

                         showEffect="{dissolveIn}"

                         hideEffect="{dissolveOut}">

           

                    <s:BorderContainer width="300" height="300"

                                                 backgroundColor="#CDCDCD"

                                                 click="{vs.selectedIndex = 0}" />

                </s:NavigatorContent>

          </mx:ViewStack>