Using a callout or quickview in a spot

[parconcb]

Hi!

i want to create a html tooltip and attach it to a spot.

I know Richtooltip but it ignores most html tags.

Is it possible to use a callout or a quickview as tooltip?

I tried and i'm always getting errors:

CalloutBase.js:6 Uncaught TypeError: Cannot read property 'left' of undefined

Furthermore the problem is that the tooltip seems to disregard all settings for delays etc..

My Code:

var myhtml = new sap.ui.core.HTML("html1", {
        // the static content as a long string literal
        content:
            "<div style='position:relative;background-color:black;width:64px;height:64px'>" +
            "<div style='position:absolute;background-color:rgb(200,  0,  0);width:8px;height:8px;top:28px;left:48px' ></div>" +
            "<div style='position:absolute;background-color:rgb(200,100,  0);width:8px;height:8px;top:18px;left:45px' ></div>" +
            "<div style='position:absolute;background-color:rgb(200,200,  0);width:8px;height:8px;top:11px;left:38px' ></div>" +
            "<div style='position:absolute;background-color:rgb(100,200,  0);width:8px;height:8px;top: 8px;left:28px' ></div>" +
            "<div style='position:absolute;background-color:rgb(  0,200,  0);width:8px;height:8px;top:11px;left:18px' ></div>" +
            "<div style='position:absolute;background-color:rgb(  0,200,100);width:8px;height:8px;top:18px;left:11px' ></div>" +
            "<div style='position:absolute;background-color:rgb(  0,200,200);width:8px;height:8px;top:28px;left: 8px' ></div>" +
            "<div style='position:absolute;background-color:rgb(  0,100,200);width:8px;height:8px;top:38px;left:11px' ></div>" +
            "<div style='position:absolute;background-color:rgb(  0,  0,200);width:8px;height:8px;top:45px;left:18px' ></div>" +
            "<div style='position:absolute;background-color:rgb(100,  0,200);width:8px;height:8px;top:48px;left:28px' ></div>" +
            "<div style='position:absolute;background-color:rgb(200,  0,200);width:8px;height:8px;top:45px;left:38px' ></div>" +
            "<div style='position:absolute;background-color:rgb(200,  0,100);width:8px;height:8px;top:38px;left:45px' ></div>" +
            "</div>",
    });

var oCallout = new sap.ui.commons.Callout({
    content: myhtml,   
    openDelay: 0,
    closeDelay: 3500,
    openDuration: 0,
    closeDuration: 0
});

var myspot = new sap.ui.vbm.Spot({
adrid:         adrid,
altId:         altId,
position:      x + ';' + y + ';0',
tooltip:       oCallout,
image:         bitmap,
imageSelected: 'pin_red_geo.gif',
hotscale:      "1.4;1.4;1.4",
hotdeltacolor: "RHLSA(90;1.0;1.0;1.0)",
alignment:     alignment

});

Thank you!!

Christian

[former_member182119]

Hello Christian,

to my knowledge it is not possible to use callout or quickview with a vbm.Spot. Those controls require a parent DOM element to position. The spot is not a DOM element, it is just pixels on a canvas. Thus there is noting to relate to, which most likely causes those errors.

The only way to use callout or quickview with a VB map is to use container VOs hosting real DOM based render objects. However, this is only a solution if not a high number of objects should be shown (I would say < 100).

Cheers Uwe