Extending Badge + CalloutCircle

[yongpark]

Hi Susie! First off, amazing D3 module you built out. This is absolutely great. I just had a quick question about extending the badge or CalloutCircle type to combine the features of both. I'd love to have a circle with text inside that can handle a hover/click/action to pop out additional information. Any info pointing me in the right way would be great! Also sorry if this isn't the appropriate place to ask about annotation questions, first time using Github Issues.

[susielu]

Hi there, how much text inside the circle do you need to be able to handle? Is it more than one character?

[yongpark]

Hi Susie! Appreciate the quick reply. I've tested the annotation badge to handle 2 characters, which works pretty well, but I'd like it to handle 3 if possible w/ click functionality. Thanks!

On Tue, Aug 8, 2017 at 9:49 PM, Susie [email protected] wrote:

Hi there, how much text inside the circle do you need to be able to handle? Is it more than one character?

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/susielu/d3-annotation/issues/36#issuecomment-321151891, or mute the thread https://github.com/notifications/unsubscribe-auth/AA4imspnxE_W8qyXn00dCc40DvLt9OEHks5sWTpUgaJpZM4OtStT .

--

Cheers,

Yong Park Mobile: 619-318-0160 Email: [email protected]

[susielu]

So the badge has a radius parameter you could use to fit the 3 character size, then you could wire it up to change to a calloutcircle on hover or on click. These are all of the actions you could add to an annotation: annotation.on() Takes the values 'subjectover', 'subjeout', 'subjectclick', 'connectorover', 'connectout', 'connectorclick', 'noteover', 'noteout', 'notecclick', 'dragend', 'dragstart' as custom dispatch events you can hook into. This block has an example: https://bl.ocks.org/susielu/63269cf8ec84497920f2b7ef1ac85039

Does that make sense?

[yongpark]

Hey Susie, the majority of your response makes sense but I'm not entirely sure how to change the annotation type from badge to calloutcircle on hover/click.

Here's a sample of my code for the annotation: https://repl.it/KQBn/3. I set it initially to badge and I'm assuming I change from badge to calloutcircle inside the on() function but not entirely sure how to call type() on a single annotation. Thanks!

On Fri, Aug 18, 2017 at 12:12 PM, Susie [email protected] wrote:

So the badge has a radius parameter you could use to fit the 3 character size, then you could wire it up to change to a calloutcircle on hover or on click. These are all of the actions you could add to an annotation: annotation.on() Takes the values 'subjectover', 'subjeout', 'subjectclick', 'connectorover', 'connectout', 'connectorclick', 'noteover', 'noteout', 'notecclick', 'dragend', 'dragstart' as custom dispatch events you can hook into. This block has an example: https://bl.ocks.org/susielu/ 63269cf8ec84497920f2b7ef1ac85039

Does that make sense?

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/susielu/d3-annotation/issues/36#issuecomment-323437877, or mute the thread https://github.com/notifications/unsubscribe-auth/AA4imkg0Iq32eZO7xP4_IjXeto77k7LLks5sZeI3gaJpZM4OtStT .

--

Cheers,

Yong Park Mobile: 619-318-0160 Email: [email protected]