Upvote 1

Can I make an interactive line chart?

Known Nikita 17 months ago

Hi I'm very new to this (1 day old) just a noob. I was wondering if I can make an interactive chart like this?

3e3fa55a6db422d3ded465b6c5a69a8f

So when you drag the dashed line, the chart changes color. If yes, how can I do it? Thank you!

Replies (10)
photo
1

Hello, it is possible, I am attaching an example in a dynamic panel, you can see the slide event in the middle line (path2), also take into account that the rectangle has a setting ajusted in properties, the background to %80, to give the color change effect.

let me know how it went.

Regards.

photo
1

Hi thank you so much for the reply!!! I was trying to replicate what you did but I realized that I can't apply it to my design because the background and the chart is not white. :( Is there another way to do it? TIA!

e27757bdeea264fafe3cd84d2925b6a1

photo
1

Hi, you can use this same example by changing the rectangle's background color and/or its opacity, you can also use the image element instead of the rectangle and adjust the blending and opacity properties, all from the properties palette.

Regards.

photo
1

I tried to change the color a bit and it did work! Not the same gray with my design but it looks good enough! Thanks again for the reply... But I am having a problem with the interactions. I will post videos of the problem and my layers for reference. Hope you could help me!


What I want to achieve is, upon mouse enter on the chart it will "zoom" in on the chart a little bit.

7614a9b8ce05a4e7a731d60b67dcfeeb

Problem 1

The rectangle is very visible up until you interact with it. When I drag the line, the hidden layer keeps on appearing.


Problem 2

When I tick on the "prevent element from moving outside of its paren'ts area" the rectangle isn't following the movement of the line anymore.

photo
1

I cannot edit my reply, there's no submit button. Anyway, I just hid the rectangle first. I tried to make 2 screens instead but the same problem occurs. When I drag the line to the left, it goes back to the first screen but when I drag the line to the right it works pretty well.

photo
1

Hello, could you send us your vp for review?

Thank you.

photo
1

Hi sure! Here it is, thank you

Files: 22.vp
photo
1

Hello, after making the "move" of the rectangle "fade", when you drag the line, you should put it inside the dynamic panel again. The move removes the element from the containers.

Regards.

photo
1

Hi sorry I don't get it :( what will I put back inside the panel?

photo
1

Hello, when you move the rectangle, it comes out of the container, you have to join it to a new dynamic panel.

Let me know how it goes.

Regards

Leave a Comment
 
Attach a file