You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@flex.apache.org by Deepak MS <me...@gmail.com> on 2014/08/27 11:46:16 UTC
Lineseries tooltip on mobile
Hi there,
I'm using a columnchart with a lineseries in it for an ipad app. I have
enabled tooltip for it. But unfortunately its too difficult to get the
tooltip on the device when we move the finger over it.
Hence I planned to add a custom circleitemrenderer with width and height of
20 to get the custom tooltip by adding a click\touchtap event on it.
But unfortunately, it is not triggering the click\touchtap event at all.
My code:
myLineSeries.setStyle('itemRenderer', new ClassFactory(DataPointRenderer));
public class DataPointRenderer extends CircleItemRenderer
{
public function DataPointRenderer()
{
super();
width = 20;
height = 20;
addEventListener(MouseEvent.CLICK, onClick);
addEventListener(TouchEvent.TOUCH_TAP, onClick);
addEventListener(MouseEvent.MOUSE_OVER, onOver);
}
private var model:ApplicationModelLocator =
ApplicationModelLocator.getInstance();
private function onOver(event:MouseEvent):void
{
model.showAlert('over'); /// This function is not at all
called even after clicking(both on simulator as well as on device)
}
private function onClick(event:MouseEvent):void
{
model.showAlert('clicked'); /// This function is not at all
called even after mouse hover (on desktop simulator)
}
override protected function
updateDisplayList(unscaledWidth:Number,unscaledHeight:Number):void
{
super.updateDisplayList(unscaledWidth, unscaledHeight);
var currentFill:uint;
var g:Graphics = graphics;
g.clear();
if (data is ChartItem && data.hasOwnProperty('fill'))
{
currentFill = data.fill.color;
g.beginFill(currentFill);
g.drawCircle(5,5,20);
g.endFill();
}
}
}
Am I missing something here?
Re: Lineseries tooltip on mobile
Posted by Deepak MS <me...@gmail.com>.
I added that piece under measure.
But still, onClick method isn't getting called.
On Fri, Sep 5, 2014 at 2:40 PM, Justin Mclean <ju...@classsoftware.com>
wrote:
> Hi,
>
> >>> public function DataPointRenderer()
> >>> {
> >>> super();
> >>> width = 20;
> >>> height = 20;
> >>> addEventListener(MouseEvent.CLICK, onClick);
> >>> addEventListener(TouchEvent.TOUCH_TAP, onClick);
> >>>
> >>> addEventListener(MouseEvent.MOUSE_OVER, onOver);
> >>> }
>
>
> Not closely checked the code or tried it out but setting width, height and
> adding event listeners is not normally done in a constructor, you may have
> to wait until the component is initialised.
>
> Thanks,
> Justin
Re: Lineseries tooltip on mobile
Posted by Justin Mclean <ju...@classsoftware.com>.
Hi,
>>> public function DataPointRenderer()
>>> {
>>> super();
>>> width = 20;
>>> height = 20;
>>> addEventListener(MouseEvent.CLICK, onClick);
>>> addEventListener(TouchEvent.TOUCH_TAP, onClick);
>>>
>>> addEventListener(MouseEvent.MOUSE_OVER, onOver);
>>> }
Not closely checked the code or tried it out but setting width, height and adding event listeners is not normally done in a constructor, you may have to wait until the component is initialised.
Thanks,
Justin
Re: Lineseries tooltip on mobile
Posted by Philip Medlam <ph...@gmail.com>.
Yes, but if you allow the user to alter the x-axis min/max, the user will
be able to easily select a specific point to show the value.
If I misunderstood, apologies.
Phil.
On Fri, Sep 5, 2014 at 1:36 PM, Deepak MS <me...@gmail.com> wrote:
> Hello Phil,
> There is no issue with xaxis, I just wanted to show tooltip on click of
> custom datapoint on lineseries.
>
>
> On Fri, Sep 5, 2014 at 3:36 PM, Philip Medlam <ph...@gmail.com>
> wrote:
>
> > Have you considered adding a slider to allow you to change the Xaxis
> range
> > ala
> > <s:HSlider id="RHSslider"
> > width="40%"
> > minimum="0" maximum="{fs/2}"
> > value="{hAxis2.maximum}" stepSize="5"
> > snapInterval="5"
> > liveDragging="true"
> > thumbRelease="changeRHSaxis()"/>
> >
> > I suggest thmbRelease (rather than Change) to stop the chart updating
> > dynamically as you slide the thumb, as that might be too slow.
> >
> > The user can then (maybe you need two sliders, one for min value of xaxis
> > and one for max xvalue (or setup a multi thumb slider component).
> >
> > Phil.
> >
> >
> > On Fri, Sep 5, 2014 at 10:04 AM, Deepak MS <me...@gmail.com>
> > wrote:
> >
> > > Any tips on this one?
> > >
> > >
> > > On Thu, Aug 28, 2014 at 9:58 AM, Deepak MS <me...@gmail.com>
> > > wrote:
> > >
> > > > Any help on this ? : )
> > > > Main objective here is to make enough room on line series data point
> so
> > > > that user can easily touch\tap it and on doing so, show the tooltip
> > data.
> > > >
> > > > I'm still wondering why isn't it triggering the events that are
> > > > registered.
> > > >
> > > >
> > > > On Wed, Aug 27, 2014 at 3:16 PM, Deepak MS <megharajdeepak@gmail.com
> >
> > > > wrote:
> > > >
> > > >> Hi there,
> > > >> I'm using a columnchart with a lineseries in it for an ipad app. I
> > have
> > > >> enabled tooltip for it. But unfortunately its too difficult to get
> the
> > > >> tooltip on the device when we move the finger over it.
> > > >>
> > > >> Hence I planned to add a custom circleitemrenderer with width and
> > height
> > > >> of 20 to get the custom tooltip by adding a click\touchtap event on
> > it.
> > > >>
> > > >> But unfortunately, it is not triggering the click\touchtap event at
> > all.
> > > >>
> > > >> My code:
> > > >>
> > > >> myLineSeries.setStyle('itemRenderer', new
> > > >> ClassFactory(DataPointRenderer));
> > > >>
> > > >>
> > > >> public class DataPointRenderer extends CircleItemRenderer
> > > >> {
> > > >> public function DataPointRenderer()
> > > >> {
> > > >> super();
> > > >> width = 20;
> > > >> height = 20;
> > > >> addEventListener(MouseEvent.CLICK, onClick);
> > > >> addEventListener(TouchEvent.TOUCH_TAP, onClick);
> > > >>
> > > >> addEventListener(MouseEvent.MOUSE_OVER, onOver);
> > > >> }
> > > >>
> > > >> private var model:ApplicationModelLocator =
> > > >> ApplicationModelLocator.getInstance();
> > > >> private function onOver(event:MouseEvent):void
> > > >> {
> > > >> model.showAlert('over'); /// This function is not at
> all
> > > >> called even after clicking(both on simulator as well as on device)
> > > >> }
> > > >>
> > > >> private function onClick(event:MouseEvent):void
> > > >> {
> > > >> model.showAlert('clicked'); /// This function is not
> at
> > > >> all called even after mouse hover (on desktop simulator)
> > > >> }
> > > >>
> > > >> override protected function
> > > >> updateDisplayList(unscaledWidth:Number,unscaledHeight:Number):void
> > > >> {
> > > >> super.updateDisplayList(unscaledWidth, unscaledHeight);
> > > >> var currentFill:uint;
> > > >> var g:Graphics = graphics;
> > > >> g.clear();
> > > >> if (data is ChartItem && data.hasOwnProperty('fill'))
> > > >> {
> > > >> currentFill = data.fill.color;
> > > >> g.beginFill(currentFill);
> > > >> g.drawCircle(5,5,20);
> > > >> g.endFill();
> > > >> }
> > > >>
> > > >> }
> > > >> }
> > > >>
> > > >>
> > > >> Am I missing something here?
> > > >>
> > > >
> > > >
> > >
> >
> >
> >
> > --
> > Philip Medlam
> >
>
--
Philip Medlam
Re: Lineseries tooltip on mobile
Posted by Deepak MS <me...@gmail.com>.
Ok. I'll try to make it simpler.
How do we add a click or touch tap event in a class that extends
CircleItemRenderer?
public class DataPointRenderer extends CircleItemRenderer
{
public function DataPointRenderer()
{
super();
}
override protected function
updateDisplayList(unscaledWidth:Number,unscaledHeight:Number):void
{
super.updateDisplayList(unscaledWidth, unscaledHeight);
var currentFill:uint;
var g:Graphics = graphics;
g.clear();
if (data is ChartItem && data.hasOwnProperty('fill'))
{
currentFill = data.fill.color;
g.beginFill(currentFill);
g.drawCircle(5,5,15);
g.endFill();
}
}
}
On Fri, Sep 5, 2014 at 6:06 PM, Deepak MS <me...@gmail.com> wrote:
> Hello Phil,
> There is no issue with xaxis, I just wanted to show tooltip on click of
> custom datapoint on lineseries.
>
>
> On Fri, Sep 5, 2014 at 3:36 PM, Philip Medlam <ph...@gmail.com>
> wrote:
>
>> Have you considered adding a slider to allow you to change the Xaxis range
>> ala
>> <s:HSlider id="RHSslider"
>> width="40%"
>> minimum="0" maximum="{fs/2}"
>> value="{hAxis2.maximum}" stepSize="5"
>> snapInterval="5"
>> liveDragging="true"
>> thumbRelease="changeRHSaxis()"/>
>>
>> I suggest thmbRelease (rather than Change) to stop the chart updating
>> dynamically as you slide the thumb, as that might be too slow.
>>
>> The user can then (maybe you need two sliders, one for min value of xaxis
>> and one for max xvalue (or setup a multi thumb slider component).
>>
>> Phil.
>>
>>
>> On Fri, Sep 5, 2014 at 10:04 AM, Deepak MS <me...@gmail.com>
>> wrote:
>>
>> > Any tips on this one?
>> >
>> >
>> > On Thu, Aug 28, 2014 at 9:58 AM, Deepak MS <me...@gmail.com>
>> > wrote:
>> >
>> > > Any help on this ? : )
>> > > Main objective here is to make enough room on line series data point
>> so
>> > > that user can easily touch\tap it and on doing so, show the tooltip
>> data.
>> > >
>> > > I'm still wondering why isn't it triggering the events that are
>> > > registered.
>> > >
>> > >
>> > > On Wed, Aug 27, 2014 at 3:16 PM, Deepak MS <me...@gmail.com>
>> > > wrote:
>> > >
>> > >> Hi there,
>> > >> I'm using a columnchart with a lineseries in it for an ipad app. I
>> have
>> > >> enabled tooltip for it. But unfortunately its too difficult to get
>> the
>> > >> tooltip on the device when we move the finger over it.
>> > >>
>> > >> Hence I planned to add a custom circleitemrenderer with width and
>> height
>> > >> of 20 to get the custom tooltip by adding a click\touchtap event on
>> it.
>> > >>
>> > >> But unfortunately, it is not triggering the click\touchtap event at
>> all.
>> > >>
>> > >> My code:
>> > >>
>> > >> myLineSeries.setStyle('itemRenderer', new
>> > >> ClassFactory(DataPointRenderer));
>> > >>
>> > >>
>> > >> public class DataPointRenderer extends CircleItemRenderer
>> > >> {
>> > >> public function DataPointRenderer()
>> > >> {
>> > >> super();
>> > >> width = 20;
>> > >> height = 20;
>> > >> addEventListener(MouseEvent.CLICK, onClick);
>> > >> addEventListener(TouchEvent.TOUCH_TAP, onClick);
>> > >>
>> > >> addEventListener(MouseEvent.MOUSE_OVER, onOver);
>> > >> }
>> > >>
>> > >> private var model:ApplicationModelLocator =
>> > >> ApplicationModelLocator.getInstance();
>> > >> private function onOver(event:MouseEvent):void
>> > >> {
>> > >> model.showAlert('over'); /// This function is not at all
>> > >> called even after clicking(both on simulator as well as on device)
>> > >> }
>> > >>
>> > >> private function onClick(event:MouseEvent):void
>> > >> {
>> > >> model.showAlert('clicked'); /// This function is not
>> at
>> > >> all called even after mouse hover (on desktop simulator)
>> > >> }
>> > >>
>> > >> override protected function
>> > >> updateDisplayList(unscaledWidth:Number,unscaledHeight:Number):void
>> > >> {
>> > >> super.updateDisplayList(unscaledWidth, unscaledHeight);
>> > >> var currentFill:uint;
>> > >> var g:Graphics = graphics;
>> > >> g.clear();
>> > >> if (data is ChartItem && data.hasOwnProperty('fill'))
>> > >> {
>> > >> currentFill = data.fill.color;
>> > >> g.beginFill(currentFill);
>> > >> g.drawCircle(5,5,20);
>> > >> g.endFill();
>> > >> }
>> > >>
>> > >> }
>> > >> }
>> > >>
>> > >>
>> > >> Am I missing something here?
>> > >>
>> > >
>> > >
>> >
>>
>>
>>
>> --
>> Philip Medlam
>>
>
>
Re: Lineseries tooltip on mobile
Posted by Deepak MS <me...@gmail.com>.
Hello Phil,
There is no issue with xaxis, I just wanted to show tooltip on click of
custom datapoint on lineseries.
On Fri, Sep 5, 2014 at 3:36 PM, Philip Medlam <ph...@gmail.com>
wrote:
> Have you considered adding a slider to allow you to change the Xaxis range
> ala
> <s:HSlider id="RHSslider"
> width="40%"
> minimum="0" maximum="{fs/2}"
> value="{hAxis2.maximum}" stepSize="5"
> snapInterval="5"
> liveDragging="true"
> thumbRelease="changeRHSaxis()"/>
>
> I suggest thmbRelease (rather than Change) to stop the chart updating
> dynamically as you slide the thumb, as that might be too slow.
>
> The user can then (maybe you need two sliders, one for min value of xaxis
> and one for max xvalue (or setup a multi thumb slider component).
>
> Phil.
>
>
> On Fri, Sep 5, 2014 at 10:04 AM, Deepak MS <me...@gmail.com>
> wrote:
>
> > Any tips on this one?
> >
> >
> > On Thu, Aug 28, 2014 at 9:58 AM, Deepak MS <me...@gmail.com>
> > wrote:
> >
> > > Any help on this ? : )
> > > Main objective here is to make enough room on line series data point so
> > > that user can easily touch\tap it and on doing so, show the tooltip
> data.
> > >
> > > I'm still wondering why isn't it triggering the events that are
> > > registered.
> > >
> > >
> > > On Wed, Aug 27, 2014 at 3:16 PM, Deepak MS <me...@gmail.com>
> > > wrote:
> > >
> > >> Hi there,
> > >> I'm using a columnchart with a lineseries in it for an ipad app. I
> have
> > >> enabled tooltip for it. But unfortunately its too difficult to get the
> > >> tooltip on the device when we move the finger over it.
> > >>
> > >> Hence I planned to add a custom circleitemrenderer with width and
> height
> > >> of 20 to get the custom tooltip by adding a click\touchtap event on
> it.
> > >>
> > >> But unfortunately, it is not triggering the click\touchtap event at
> all.
> > >>
> > >> My code:
> > >>
> > >> myLineSeries.setStyle('itemRenderer', new
> > >> ClassFactory(DataPointRenderer));
> > >>
> > >>
> > >> public class DataPointRenderer extends CircleItemRenderer
> > >> {
> > >> public function DataPointRenderer()
> > >> {
> > >> super();
> > >> width = 20;
> > >> height = 20;
> > >> addEventListener(MouseEvent.CLICK, onClick);
> > >> addEventListener(TouchEvent.TOUCH_TAP, onClick);
> > >>
> > >> addEventListener(MouseEvent.MOUSE_OVER, onOver);
> > >> }
> > >>
> > >> private var model:ApplicationModelLocator =
> > >> ApplicationModelLocator.getInstance();
> > >> private function onOver(event:MouseEvent):void
> > >> {
> > >> model.showAlert('over'); /// This function is not at all
> > >> called even after clicking(both on simulator as well as on device)
> > >> }
> > >>
> > >> private function onClick(event:MouseEvent):void
> > >> {
> > >> model.showAlert('clicked'); /// This function is not at
> > >> all called even after mouse hover (on desktop simulator)
> > >> }
> > >>
> > >> override protected function
> > >> updateDisplayList(unscaledWidth:Number,unscaledHeight:Number):void
> > >> {
> > >> super.updateDisplayList(unscaledWidth, unscaledHeight);
> > >> var currentFill:uint;
> > >> var g:Graphics = graphics;
> > >> g.clear();
> > >> if (data is ChartItem && data.hasOwnProperty('fill'))
> > >> {
> > >> currentFill = data.fill.color;
> > >> g.beginFill(currentFill);
> > >> g.drawCircle(5,5,20);
> > >> g.endFill();
> > >> }
> > >>
> > >> }
> > >> }
> > >>
> > >>
> > >> Am I missing something here?
> > >>
> > >
> > >
> >
>
>
>
> --
> Philip Medlam
>
Re: Lineseries tooltip on mobile
Posted by Philip Medlam <ph...@gmail.com>.
Have you considered adding a slider to allow you to change the Xaxis range
ala
<s:HSlider id="RHSslider"
width="40%"
minimum="0" maximum="{fs/2}"
value="{hAxis2.maximum}" stepSize="5"
snapInterval="5"
liveDragging="true"
thumbRelease="changeRHSaxis()"/>
I suggest thmbRelease (rather than Change) to stop the chart updating
dynamically as you slide the thumb, as that might be too slow.
The user can then (maybe you need two sliders, one for min value of xaxis
and one for max xvalue (or setup a multi thumb slider component).
Phil.
On Fri, Sep 5, 2014 at 10:04 AM, Deepak MS <me...@gmail.com> wrote:
> Any tips on this one?
>
>
> On Thu, Aug 28, 2014 at 9:58 AM, Deepak MS <me...@gmail.com>
> wrote:
>
> > Any help on this ? : )
> > Main objective here is to make enough room on line series data point so
> > that user can easily touch\tap it and on doing so, show the tooltip data.
> >
> > I'm still wondering why isn't it triggering the events that are
> > registered.
> >
> >
> > On Wed, Aug 27, 2014 at 3:16 PM, Deepak MS <me...@gmail.com>
> > wrote:
> >
> >> Hi there,
> >> I'm using a columnchart with a lineseries in it for an ipad app. I have
> >> enabled tooltip for it. But unfortunately its too difficult to get the
> >> tooltip on the device when we move the finger over it.
> >>
> >> Hence I planned to add a custom circleitemrenderer with width and height
> >> of 20 to get the custom tooltip by adding a click\touchtap event on it.
> >>
> >> But unfortunately, it is not triggering the click\touchtap event at all.
> >>
> >> My code:
> >>
> >> myLineSeries.setStyle('itemRenderer', new
> >> ClassFactory(DataPointRenderer));
> >>
> >>
> >> public class DataPointRenderer extends CircleItemRenderer
> >> {
> >> public function DataPointRenderer()
> >> {
> >> super();
> >> width = 20;
> >> height = 20;
> >> addEventListener(MouseEvent.CLICK, onClick);
> >> addEventListener(TouchEvent.TOUCH_TAP, onClick);
> >>
> >> addEventListener(MouseEvent.MOUSE_OVER, onOver);
> >> }
> >>
> >> private var model:ApplicationModelLocator =
> >> ApplicationModelLocator.getInstance();
> >> private function onOver(event:MouseEvent):void
> >> {
> >> model.showAlert('over'); /// This function is not at all
> >> called even after clicking(both on simulator as well as on device)
> >> }
> >>
> >> private function onClick(event:MouseEvent):void
> >> {
> >> model.showAlert('clicked'); /// This function is not at
> >> all called even after mouse hover (on desktop simulator)
> >> }
> >>
> >> override protected function
> >> updateDisplayList(unscaledWidth:Number,unscaledHeight:Number):void
> >> {
> >> super.updateDisplayList(unscaledWidth, unscaledHeight);
> >> var currentFill:uint;
> >> var g:Graphics = graphics;
> >> g.clear();
> >> if (data is ChartItem && data.hasOwnProperty('fill'))
> >> {
> >> currentFill = data.fill.color;
> >> g.beginFill(currentFill);
> >> g.drawCircle(5,5,20);
> >> g.endFill();
> >> }
> >>
> >> }
> >> }
> >>
> >>
> >> Am I missing something here?
> >>
> >
> >
>
--
Philip Medlam
Re: Lineseries tooltip on mobile
Posted by Deepak MS <me...@gmail.com>.
Any tips on this one?
On Thu, Aug 28, 2014 at 9:58 AM, Deepak MS <me...@gmail.com> wrote:
> Any help on this ? : )
> Main objective here is to make enough room on line series data point so
> that user can easily touch\tap it and on doing so, show the tooltip data.
>
> I'm still wondering why isn't it triggering the events that are
> registered.
>
>
> On Wed, Aug 27, 2014 at 3:16 PM, Deepak MS <me...@gmail.com>
> wrote:
>
>> Hi there,
>> I'm using a columnchart with a lineseries in it for an ipad app. I have
>> enabled tooltip for it. But unfortunately its too difficult to get the
>> tooltip on the device when we move the finger over it.
>>
>> Hence I planned to add a custom circleitemrenderer with width and height
>> of 20 to get the custom tooltip by adding a click\touchtap event on it.
>>
>> But unfortunately, it is not triggering the click\touchtap event at all.
>>
>> My code:
>>
>> myLineSeries.setStyle('itemRenderer', new
>> ClassFactory(DataPointRenderer));
>>
>>
>> public class DataPointRenderer extends CircleItemRenderer
>> {
>> public function DataPointRenderer()
>> {
>> super();
>> width = 20;
>> height = 20;
>> addEventListener(MouseEvent.CLICK, onClick);
>> addEventListener(TouchEvent.TOUCH_TAP, onClick);
>>
>> addEventListener(MouseEvent.MOUSE_OVER, onOver);
>> }
>>
>> private var model:ApplicationModelLocator =
>> ApplicationModelLocator.getInstance();
>> private function onOver(event:MouseEvent):void
>> {
>> model.showAlert('over'); /// This function is not at all
>> called even after clicking(both on simulator as well as on device)
>> }
>>
>> private function onClick(event:MouseEvent):void
>> {
>> model.showAlert('clicked'); /// This function is not at
>> all called even after mouse hover (on desktop simulator)
>> }
>>
>> override protected function
>> updateDisplayList(unscaledWidth:Number,unscaledHeight:Number):void
>> {
>> super.updateDisplayList(unscaledWidth, unscaledHeight);
>> var currentFill:uint;
>> var g:Graphics = graphics;
>> g.clear();
>> if (data is ChartItem && data.hasOwnProperty('fill'))
>> {
>> currentFill = data.fill.color;
>> g.beginFill(currentFill);
>> g.drawCircle(5,5,20);
>> g.endFill();
>> }
>>
>> }
>> }
>>
>>
>> Am I missing something here?
>>
>
>
Re: Lineseries tooltip on mobile
Posted by Deepak MS <me...@gmail.com>.
Any help on this ? : )
Main objective here is to make enough room on line series data point so
that user can easily touch\tap it and on doing so, show the tooltip data.
I'm still wondering why isn't it triggering the events that are registered.
On Wed, Aug 27, 2014 at 3:16 PM, Deepak MS <me...@gmail.com> wrote:
> Hi there,
> I'm using a columnchart with a lineseries in it for an ipad app. I have
> enabled tooltip for it. But unfortunately its too difficult to get the
> tooltip on the device when we move the finger over it.
>
> Hence I planned to add a custom circleitemrenderer with width and height
> of 20 to get the custom tooltip by adding a click\touchtap event on it.
>
> But unfortunately, it is not triggering the click\touchtap event at all.
>
> My code:
>
> myLineSeries.setStyle('itemRenderer', new ClassFactory(DataPointRenderer));
>
>
> public class DataPointRenderer extends CircleItemRenderer
> {
> public function DataPointRenderer()
> {
> super();
> width = 20;
> height = 20;
> addEventListener(MouseEvent.CLICK, onClick);
> addEventListener(TouchEvent.TOUCH_TAP, onClick);
>
> addEventListener(MouseEvent.MOUSE_OVER, onOver);
> }
>
> private var model:ApplicationModelLocator =
> ApplicationModelLocator.getInstance();
> private function onOver(event:MouseEvent):void
> {
> model.showAlert('over'); /// This function is not at all
> called even after clicking(both on simulator as well as on device)
> }
>
> private function onClick(event:MouseEvent):void
> {
> model.showAlert('clicked'); /// This function is not at all
> called even after mouse hover (on desktop simulator)
> }
>
> override protected function
> updateDisplayList(unscaledWidth:Number,unscaledHeight:Number):void
> {
> super.updateDisplayList(unscaledWidth, unscaledHeight);
> var currentFill:uint;
> var g:Graphics = graphics;
> g.clear();
> if (data is ChartItem && data.hasOwnProperty('fill'))
> {
> currentFill = data.fill.color;
> g.beginFill(currentFill);
> g.drawCircle(5,5,20);
> g.endFill();
> }
>
> }
> }
>
>
> Am I missing something here?
>
Re: Lineseries tooltip on mobile
Posted by Deepak MS <me...@gmail.com>.
Hi Maurice,
You are a life saver : ) Thank you so much for that tip. I had been
struggling on that issue for quite some time. I have set mouseSensitivity
to about 50 now, which pretty much covers a fat finger's touch on it and
display's data tip smoothly and there is no need of custom renderer too.
Thanks again...
Cheers!
On Tue, Sep 9, 2014 at 6:14 PM, Maurice Amsellem <
maurice.amsellem@systar.com> wrote:
> Hi Deepak,
>
> I didn't test, but since Datatips are managed at the chart level, not at
> the renderers level, (check ChartBase.mouseOverHandler() ), then it likely
> that simply adding click/tap listeners to the renderer will not work.
>
> Did you try setting mouseSensitivity property for the chart ?
>
>
> http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/mx/charts/chartClasses/ChartBase.html#mouseSensitivity
>
>
> Maurice
>
> -----Message d'origine-----
> De : Deepak MS [mailto:megharajdeepak@gmail.com]
> Envoyé : mercredi 27 août 2014 11:46
> À : users@flex.apache.org
> Objet : Lineseries tooltip on mobile
>
> Hi there,
> I'm using a columnchart with a lineseries in it for an ipad app. I have
> enabled tooltip for it. But unfortunately its too difficult to get the
> tooltip on the device when we move the finger over it.
>
> Hence I planned to add a custom circleitemrenderer with width and height of
> 20 to get the custom tooltip by adding a click\touchtap event on it.
>
> But unfortunately, it is not triggering the click\touchtap event at all.
>
> My code:
>
> myLineSeries.setStyle('itemRenderer', new ClassFactory(DataPointRenderer));
>
>
> public class DataPointRenderer extends CircleItemRenderer
> {
> public function DataPointRenderer()
> {
> super();
> width = 20;
> height = 20;
> addEventListener(MouseEvent.CLICK, onClick);
> addEventListener(TouchEvent.TOUCH_TAP, onClick);
>
> addEventListener(MouseEvent.MOUSE_OVER, onOver);
> }
>
> private var model:ApplicationModelLocator =
> ApplicationModelLocator.getInstance();
> private function onOver(event:MouseEvent):void
> {
> model.showAlert('over'); /// This function is not at all
> called even after clicking(both on simulator as well as on device)
> }
>
> private function onClick(event:MouseEvent):void
> {
> model.showAlert('clicked'); /// This function is not at all
> called even after mouse hover (on desktop simulator)
> }
>
> override protected function
> updateDisplayList(unscaledWidth:Number,unscaledHeight:Number):void
> {
> super.updateDisplayList(unscaledWidth, unscaledHeight);
> var currentFill:uint;
> var g:Graphics = graphics;
> g.clear();
> if (data is ChartItem && data.hasOwnProperty('fill'))
> {
> currentFill = data.fill.color;
> g.beginFill(currentFill);
> g.drawCircle(5,5,20);
> g.endFill();
> }
>
> }
> }
>
>
> Am I missing something here?
>
RE: Lineseries tooltip on mobile
Posted by Maurice Amsellem <ma...@systar.com>.
Hi Deepak,
I didn't test, but since Datatips are managed at the chart level, not at the renderers level, (check ChartBase.mouseOverHandler() ), then it likely that simply adding click/tap listeners to the renderer will not work.
Did you try setting mouseSensitivity property for the chart ?
http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/mx/charts/chartClasses/ChartBase.html#mouseSensitivity
Maurice
-----Message d'origine-----
De : Deepak MS [mailto:megharajdeepak@gmail.com]
Envoyé : mercredi 27 août 2014 11:46
À : users@flex.apache.org
Objet : Lineseries tooltip on mobile
Hi there,
I'm using a columnchart with a lineseries in it for an ipad app. I have enabled tooltip for it. But unfortunately its too difficult to get the tooltip on the device when we move the finger over it.
Hence I planned to add a custom circleitemrenderer with width and height of
20 to get the custom tooltip by adding a click\touchtap event on it.
But unfortunately, it is not triggering the click\touchtap event at all.
My code:
myLineSeries.setStyle('itemRenderer', new ClassFactory(DataPointRenderer));
public class DataPointRenderer extends CircleItemRenderer
{
public function DataPointRenderer()
{
super();
width = 20;
height = 20;
addEventListener(MouseEvent.CLICK, onClick);
addEventListener(TouchEvent.TOUCH_TAP, onClick);
addEventListener(MouseEvent.MOUSE_OVER, onOver);
}
private var model:ApplicationModelLocator = ApplicationModelLocator.getInstance();
private function onOver(event:MouseEvent):void
{
model.showAlert('over'); /// This function is not at all called even after clicking(both on simulator as well as on device)
}
private function onClick(event:MouseEvent):void
{
model.showAlert('clicked'); /// This function is not at all
called even after mouse hover (on desktop simulator)
}
override protected function
updateDisplayList(unscaledWidth:Number,unscaledHeight:Number):void
{
super.updateDisplayList(unscaledWidth, unscaledHeight);
var currentFill:uint;
var g:Graphics = graphics;
g.clear();
if (data is ChartItem && data.hasOwnProperty('fill'))
{
currentFill = data.fill.color;
g.beginFill(currentFill);
g.drawCircle(5,5,20);
g.endFill();
}
}
}
Am I missing something here?