ShowAnnotation script and vertical positioning of pop up

[norman]

Hi,

I've added annotations to my chart and I have it so that custom text is displayed in a pop up on the mouseover event. This was achieved in the standard way i.e. using GetHTMLMap and MapElements etc. (i.e. the pop up is handled by TeeCharts ShowAnnotations script). However, I've noticed that the position of the pop up varies depending on how far down you've scrolled on the page - sometimes the pop up isn't visible at all, i.e. its positioned towards the top of the page when you've scrolled down. (I think this is a known issue?). Is there a way to position the pop up in a fixed location, for example always at the upper left or upper right hand corner of the chart instead? This must be achieved without affecting the pop ups that appear over the series points which I also have on my chart and which appear to always show in the correct position.

Thanks

(PS I'm using version 3.5.3371.26405 and I cant upgrade without checking that nothing else gets adversely affected)

[Yeray]

Hi norman,

It will be probably related to this other similar problem.

[norman]

Hi Yeray,

Yes, it sounds like it but I can't use a fixed size page or coordinates as it suggest. My page is created dynamically at runtime. My page comprises of a number of modules that get loaded into the page (like sharepoint). Is there any javascript that could essentially pin the pop up to the div created by the chart or even to the top left corner of the page. I could add the required javascript at runtime.

Thanks

[norman]

Hi,

Any ideas on positioning the annotation at some other fixed location - if its a problem determining the position of the chart how about at the top left corner or bottom right corner of the browser window (you sometimes see a menu bar implemented this way - i.e. as you scroll up and down a long page the menu bar remains visible).

Thanks,

[Marc]

Hello,

We'll see if we can come up with one or two suggestions that might be acceptable and post them back to this thread.

Regards,
Marc

[Marc]

Hello Norman,

You might find that the WebChart demo "Interacting_with_Chart : .Mouseover_Hints : CustomisingMouseoverMarks" is similar to what you're looking to achieve. That example uses Steema.TeeChart.Tools.CustomHotspot to assign a mouseover text to the Legend. CustomHotspot is intended to offer access to any Chart location in the same way (can be relative to Chart top, left .. etc). CustomHotspot can work alongside SeriesHotspot as per the example, so shouldn't affect any other hotspots you have already setup. Locations set here should scroll correctly with the Chart on the page.

If you prefer to define a popup externally to TeeChart, to meet your suggestion of setting the popup that is fixed to a location on a page, rather than to a TeeChart, then you could use standard javascripting to create a <div> (with visibility:true or false according to mouse location). Techniques to achieve that are documented widely on webs that discuss javascript techniques.

I tried this for Internet Explorer .. it seemed to hold the text in the right place:

Code: Select all

<script type="text/javascript">

window.onscroll = scrollEvent;

function scrollEvent() {
   setTimeout("setPos('myObj')",5);
}

var is_ie = navigator.appName == 'Microsoft Internet Explorer';

function setPos(obj)
{
	obj = document.getElementById(obj);

    if (is_ie) {
    
      obj.style.left=document.body.scrollLeft;
      obj.style.top=document.body.scrollTop;

    }
    else {
      //pending positioning code other browser types
    }
}

</script>

applied to test div:

<div id="myObj" style=" z-index=10; position=absolute; left=0; top=0">test div test div test div test div</div>

I hope that may be of help.

Regards,
Marc

[norman]

Hi Marc,

The example I see at the location you provided (i.e. Interacting_with_Chart : .Mouseover_Hints : CustomisingMouseoverMarks) demonstrates how to fade-in text hints, images or drill-down Charts when passing the mouse over the data points of the Chart. You can choose the type of Tool tip content you wish (either image, statistics chart, num. of accidents). I dont see any reference to a legend.

[Yeray]

Hi Norman,

Not with the legend but it shows how to have a pop up in a relative position to the chart, isn't it what you need?

[norman]

Hi,

I'm a bit confused - is this the example you are referring to?

example.gif (42.09 KiB) Viewed 14247 times

How does this differ from what I have done already (see below)?

example2.gif (14.22 KiB) Viewed 14246 times

The Analyst Opinion popup appears when you hover over the A annotation except it isn't apparent on a page where you've scrolled vertically.

[Sandra]

Hello Norman,

We haven't forgotten this. We are investigating it and We try to respond asap.


Thanks,

[Marc]

Hello Norman,

I may have misunderstood what you require, let's backtrack a little just in case. The demo in question, "Interacting_with_Chart : .Mouseover_Hints : CustomisingMouseoverMarks", that you've made a screenshot of, is the one I was referring to.

The demo does do what you say, ie. "fade-in text hints, images or drill-down Charts when passing the mouse over the data points of the Chart", but also displays a mouseover text dialogue when you pass the mouse across the Legend. The text is always displayed just below the Mousepointer but only when the mousepointer is over the Legend. That remains the case if I size the window to force a scrollbar on the demo and scroll it up or down. The type of hotspot is Steema.TeeChart.Tools.CustomHotspot.

Is that relevant to what you wish to achieve?

Regards,
Marc