Jump to content
JChartFX Community
  • 0

Position of tooltip when in relative positioned container


troelsn
 Share

Question

I'm having a problem with tooltips being displayed way off my chart. It seems to be related to the fact that my chart is inside a DIV with position: relative, and I need it to be so, since I have other elements that I want to position absolute relative to my outer DIV. But when I do this, the tooltips are displayed way down my page and I guees it's because they are positioned absolute, but according to the document. What can I do?

Link to comment
Share on other sites

4 answers to this question

Recommended Posts

  • 0

Hi JuanC,

I'm using the most recent version (7.1.4982) but I'm still experiencing the problem.

Here is some sample code:

<!DOCTYPE html>




<html xmlns="http://www.w3.org/1999/xhtml">


<head>


    <link href="jchartfx-7.1.4982/styles/jchartfx.css" rel="stylesheet" />


    <script type="text/javascript" src="Scripts/jquery-2.0.3.min.js"></script>


    <script type="text/javascript" src="jchartfx-7.1.4982/js/jchartfx.system.js"></script>


    <script type="text/javascript" src="jchartfx-7.1.4982/js/jchartfx.coreBasic.js"></script>


    <script type="text/javascript" src="jchartfx-7.1.4982/js/jchartfx.animation.js"></script>


    <script type="text/javascript">


        var c1 = null;


        var c2 = null;


        $(document).ready(function () {


            c1 = new cfx.Chart();


            c1.setGallery(cfx.Gallery.Bar);


            c1.create('chart1');




            c2 = new cfx.Chart();


            c2.setGallery(cfx.Gallery.Bar);


            c2.create('chart2');


        });


    </script>


    <style type="text/css">


        div.chart-container {


            position: relative;


        }




        div.chart {


            width: 600px;


            height: 400px;


            display: inline-block;


        }


    </style>


</head>


<body>


    <div class="chart-container">


        <div class="chart" id="chart1"></div>


    </div>


    <div class="chart-container">


        <div class="chart" id="chart2"></div>


    </div>


</body>


</html> 

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

×
×
  • Create New...