Get a Bubble In Front of Others?

8 posts, 0 answers
  1. Aaron
    Aaron avatar
    10 posts
    Member since:
    Sep 2014

    Posted 24 Feb 2015 Link to this post

    I have several bubbles which are all very close to each other. One of the bubble is the "User", and is colored differently. It's currently overlapped by other bubbles. Is there a way to get this bubble in front of others?

    Aaron
  2. Danail Vasilev
    Admin
    Danail Vasilev avatar
    1502 posts

    Posted 25 Feb 2015 Link to this post

    Hello Aaron,

    You can use the series.zIndex property to control the z-index of series.

    Regards,
    Danail Vasilev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Aaron
    Aaron avatar
    10 posts
    Member since:
    Sep 2014

    Posted 25 Feb 2015 in reply to Danail Vasilev Link to this post

    That did not work. I've attached a screens shot, which you can see the Yellow bubble is still buried by the blue ones. I've set the zIndex for all bubles to "zIndex:1", and set the yellow one "zIndex:1000". I've also tried reserving here. Attached is the screen shot.
  4. Aaron
    Aaron avatar
    10 posts
    Member since:
    Sep 2014

    Posted 25 Feb 2015 in reply to Danail Vasilev Link to this post

    Hi Danail:

    I noticed something, in your example, you didn't use the "data" but rather directly defined the "series". My script followed the demo as seen here: http://demos.telerik.com/kendo-ui/bubble-charts/index

    What's the way to apply zIndex this way?

    Aaron







  5. Aaron
    Aaron avatar
    10 posts
    Member since:
    Sep 2014

    Posted 25 Feb 2015 in reply to Aaron Link to this post

    I did get zIndex to work for the bubble chart, but noticed a strange behavior. the zIndex appear to work for the highlighted bubble if it's the same size as the rest of the bubbles. But if I crease its size, it becomes transparent or overlapped by other bubbles. I've attached a screen shot. Both of the yellow dots are on a second series with a higher zIndex.
  6. Danail Vasilev
    Admin
    Danail Vasilev avatar
    1502 posts

    Posted 26 Feb 2015 Link to this post

    Hi Aaron,

    I am not able to reproduce the mentioned issue - a short video is attached for your reference. Can you please try to reproduce the issue with this dojo example, so that I can make a local investigation?

    Regards,
    Danail Vasilev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  7. Aaron
    Aaron avatar
    10 posts
    Member since:
    Sep 2014

    Posted 26 Feb 2015 in reply to Danail Vasilev Link to this post

    Hi Daniel:

    I found the problem, in your Dojo sample, I noticed you use jQuery and Kendo.All.Min.JS from  http://cdn.kendostatic.com/2014.3.1411. I'm currently using Kendo UI from October 2014. I looked at the changelog, it indicated as version "v2014.2.1008", so I guess you're using the newest version. So I swapped out my JS reference to yours, and the bubbles now display correctly. 

    I noticed the new Kendo release is available now, and I'm going to download it. I also noticed the following in the release notes, which makes sense: "Larger bubbles overlay smaller ones making them inaccessible "

    Thanks for your help!

    Aaron
  8. Jason
    Jason avatar
    1 posts
    Member since:
    Dec 2016

    Posted 24 Jan in reply to Aaron Link to this post

    Hi Aaron.

    This chart is amazing.  Would you be willing to share the code?

    Thanks

Back to Top