How write shape

Questions
1

PolygonMeshBuilder Examples | Babylon.js Playground (babylonjs.com)

image
or
image

I will use it as a tooltip. How can I draw this shape with polygon or otherwise?

Please help me

2

You need to create a path of points that matches your shape like the provided example does.

3

@farukcelim , if you just want to draw this shapes to display tooltips, maybe another solution might be to use GUI to draw it?

I’ve created a playground example showing how to create a tooltip speech balloon using the Babylon GUI. Is that similar to what you are trying to achieve?

Texture mode Babylon.GUI | Babylon.js Playground (babylonjs.com)

4 Likes
4

Why not just use a plane with a transparency texture?

5

@srzerbetto
Thanks for your example and answer. I need to load a circle-shaped image into my tooltip. I couldn’t do that either. Do you have any advice on this? Thanks for your example and your answer. I need to load a circle-shaped image into my tooltip. I couldn’t do that either. Do you have any advice regarding this?

6

@farukcelim , if you want a different tooltip image you can just replace line 38 with the URL of the image you want to use as tooltip.

7

Hello @farukcelim just checking in if your question has been answered

8

Thanks for your answers. I solved the problem. I solved the shape using html in javascript with Css.

           		var btn = document.getElementById(btnId);

    if (btn) {
        btn.parentNode.removeChild(btn);
    }

    btn = document.createElement("div");

    btn.id = btnId;
    btn.className = "label-component";


    var btnName = document.createElement("span");
    btnName.className = "label-name";
    btnName.textContent = name;

    var btnTitle = document.createElement("span");
    btnTitle.className = "label-title";
    btnTitle.textContent = title;

    var btnImage = document.createElement("div");
    btnImage.className = "label-img";
    btnImage.style.backgroundImage = "url('" + img + "')";

    btn.appendChild("text");
    document.body.appendChild(btn);