Hi,I am using igDataChart inside a igDialog window that opens external page, so essentially the chart is inside an iframe window.My problem is with the tooltip position when hovering on the columns that are close to the right edge of the dialog.The tooltip always opens to the right so the tooltip for the right columns is being cut and is unreadable to the user.
attached are two printscreens of the chart that shows the problem.printScreen1.png - is the tooltip as it should beprintScreen2.png - is the tooltip being cut
Is there anyway to control the tooltip position - this is item tooltip for the chart
Thanks for your help
Hello Amos_silberman,
I followed the steps you suggested and was unable to reproduce the behavior you're describing. I created an igDataChart within an igDialog, however, the tooltip continued to display outside of the bounds of the dialog window. You can see this behavior in the screenshot which I have attached to this message.
I have attached the sample project I used to test this. Please test this project on your PC; whether or not it works correctly may help indicate the nature of this problem.
If the project does not work correctly, this indicates either a problem possibly specific to your environment, or a difference in the DLL versions we are using. My test was performed using the latest version of IgniteUI 2014.1.
If the project does show the product feature working correctly, this indicates a possible problem in the code of your application. It will help if you can provide a small, isolated sample application that demonstrates the behavior you are seeing.
Or, if this sample project is not an accurate demonstration of what you're trying to do, please feel free to modify it and send it back, or send a small sample project of your own if you have one.
Please let me know if I can provide any further assistance.
Hi,
Thanks for your quick response, and for your time.You have missed one step of the process I suggested, that the dialog should open an external page - another html page, and with igDialog it is done through iframe. I am nor near my computer right now, so I will be able to modify you example tomorrow.If you will try to open another html page with the chart in the opened page, you will get the tooltip behaviour I was talking about.
Thanks again
Hi,Attached is a sample based on the sample you have sent me.Thanks again
Hello,
After reviewing the sample you provided, the behavior you are describing is expected. When the tooltip leaves the area of the iframe, it will resize to fit the content. Using an iframe, I do not see a way for it to be possible for the tooltip to always be visible as you desire. May I ask why you are using an iframe? It would probably be easier and better practice to have the igDataChart loaded into the igDialog as I had done in my initial sample. This also solves the issue with your tooltip. Please let me know if this is a possibility. I look forward to hearing back from you.
Hi Joseph,Thanks again for your time.The way I see it, I am not sure the behavior of the tooltip is expected. It seems like the tooltip is always positioned to the lower right of the cursor pointer. I would expect that especially when setting the property tooltipPosition: 'auto', that when the tooltip hits the right edge (or the bottom edge), it would change its position rather then resize itself to try to fit the content. This is standard behavior for tooltips in windows or any other web page (try Gmail for example). The problem here is not with the dialog window, this is my scenario, but it will happen on every window, that the chart has an item close to the right edge of the screen. Try set the width of the chart in the sample that you send me to the maximum width of your screen, and you will see the behavior is repeated. With this behavior I can not use the chart on the right side of my page, or if my tooltip contains more then one or two lines, and the height of it is is larger then the normal 30-50 pixels, I can not place the chart on the bottom of the page as well (example screenshot is attached).As for the reason I use the iframe control in my dialog window, the reason is that my "base" page can open more then 10 different dialogs, that some of them can open more dialog themself. I think having them all in my base HTML page will bloat the HTML to a very large size. Other then that some of the dialogs can be opened from other "base" pages, so keeping them in one centralized HTML file is better practice, and a better solution. I would love to drop the iframe control and supply the dialog with a template file, but the only way to do it with the igDialog control is through an iframe control.and example could be viewed at http://www.igniteui.com/dialog-window/loading-external-page .Thanks again for your time and effortsLooking forward hearing from you.