Naruto jutsus help me

[Krokara]

how can I make these powers in the character's hand
exemple:

https://www.youtube.com/watch?v=X_RwBv_7IWE

[Vinyard]

Thread has been moved to a more suitable section.

[The_GTA]

Hello Krokara,

this is actually not a very difficult task, if you have all the texture files to cycle through and knowledge of MTA drawing functions. For this task I recommend you to use the dx family of drawing functions.

1. First you need to register an onClientRender event handler.
2. Inside of it you use getPedBonePosition to find the 3D world coordinates of the ped's hand.
3. While applying some custom layout-logic, use the dxDrawMaterialPrimitive3D function to draw two triangles forming a quad with the desired dimensions and texture animation frame at the world position of the ped's hand.
4. Do not forget to cycle through the animation frames so the sparkly image changes depending on the elapsed time!

How about you try your hands at some code? If you have any further trouble about the implementation then feel free to ask! 

Edited November 5, 2021 by The_GTA

[Krokara]

9 hours ago, The_GTA said:

Hello Krokara,

this is actually not a very difficult task, if you have all the texture files to cycle through and knowledge of MTA drawing functions. For this task I recommend you to use the dx family of drawing functions.

1. First you need to register an onClientRender event handler.
2. Inside of it you use getPedBonePosition to find the 3D world coordinates of the ped's hand.
3. While applying some custom layout-logic, use the dxDrawMaterialPrimitive3D function to draw two triangles forming a quad with the desired dimensions and texture animation frame at the world position of the ped's hand.
4. Do not forget to cycle through the animation frames so the sparkly image changes depending on the elapsed time!

How about you try your hands at some code? If you have any further trouble about the implementation then feel free to ask! 

I can't draw it

  	cx, cy, cz    =  getPositionFromElementOffset(localPlayer,0.1, 0.5, 1) 
  	dxDrawMaterialPrimitive3D ( "trianglelist", texturas[math.ceil(img)], false, cx, cy, cz, cx+5, cy+20)

 

[The_GTA]

13 hours ago, Krokara said:

  	dxDrawMaterialPrimitive3D ( "trianglelist", texturas[math.ceil(img)], false, cx, cy, cz, cx+5, cy+20)

You need to put the triangle coordinates into a 3-tuple { x, y, z }, then pass the vertices as 4th+ arguments to dxDrawMaterialPrimitive3D. Do not forget to define the z-coordinate of the second coordinate!

Also, you need to draw this as triangles. If you have attended school then you know that a triangle consists of 3 points. By using the "trianglelist" primitive type you need to define 3 points for each triangle, thus you need to push 6 vertices to dxDrawMaterialPrimitive3D!

There is an example using a different primitive type inside of the wiki documentation of dxDrawPrimitive3D.

Edited November 6, 2021 by The_GTA

[Krokara]

4 hours ago, The_GTA said:

You need to put the triangle coordinates into a 3-tuple { x, y, z }, then pass the vertices as 4th+ arguments to dxDrawMaterialPrimitive3D. Do not forget to define the z-coordinate of the second coordinate!

Also, you need to draw this as triangles. If you have attended school then you know that a triangle consists of 3 points. By using the "trianglelist" primitive type you need to define 3 points for each triangle, thus you need to push 6 vertices to dxDrawMaterialPrimitive3D!

There is an example using a different primitive type inside of the wiki documentation of dxDrawPrimitive3D.

I managed to make a triangle with this function: DrawPrimitive 3D, using but its width is thin and it has no width the triangle is without shape

[Mkl]

Hello, here a little test I just made to draw a triangle on the ped :

local primitive = {}
local pos = {}

addEventHandler("onClientRender", root, function()

    pos = {getElementPosition(localPlayer)}

    primitive = {
        {pos[1]-2, pos[2], pos[3], tocolor(255,0,0)},
        {pos[1]+2, pos[2], pos[3], tocolor(0,255,0)},
        {pos[1], pos[2], pos[3]+2, tocolor(0,0,255)}
    }

    dxDrawPrimitive3D("trianglefan", false, unpack(primitive))
end
)

Hope it can help 

[Krokara]

Just now, Mkl said:

Hello, here a little test I just made to draw a triangle on the ped :

local primitive = {}
local pos = {}

addEventHandler("onClientRender", root, function()

    pos = {getElementPosition(localPlayer)}

    primitive = {
        {pos[1]-2, pos[2], pos[3], tocolor(255,0,0)},
        {pos[1]+2, pos[2], pos[3], tocolor(0,255,0)},
        {pos[1], pos[2], pos[3]+2, tocolor(0,0,255)}
    }

    dxDrawPrimitive3D("trianglefan", false, unpack(primitive))
end
)

Hope it can help 

In this video the power to maintain a shape even if you change angle

exemple: 

 

[Mkl]

I'm not sure , but you could try to use the useful function getPointFromDistanceRotation ?

https://wiki.multitheftauto.com/wiki/GetPointFromDistanceRotation

 

For example, I made it work with this test :

local primitive = {}
local pos = {}
local rot = 0

addEventHandler("onClientRender", root, function()

    pos = {getElementPosition(localPlayer)}
    _, _, rot = getElementRotation(localPlayer)
    
    local x1, y1 = getPointFromDistanceRotation(pos[1], pos[2], 1, -rot+90)
    local x2, y2 = getPointFromDistanceRotation(pos[1], pos[2], -1, -rot+90)

    primitive = {
        {x1, y1, pos[3], tocolor(255,0,0)},
        {x2, y2, pos[3], tocolor(0,255,0)},
        {pos[1], pos[2], pos[3]+2, tocolor(0,0,255)}
    }

    dxDrawPrimitive3D("trianglefan", false, unpack(primitive))
end
)

function getPointFromDistanceRotation(x, y, dist, angle)

    local a = math.rad(90 - angle);
 
    local dx = math.cos(a) * dist;
    local dy = math.sin(a) * dist;
 
    return x+dx, y+dy;
 
end

 

Edited November 6, 2021 by Mkl

[The_GTA]

4 hours ago, Krokara said:

... but its width is thin and it has no width the triangle is without shape

You seem to lack the mathematical and modelling experience about the human vision. Let me start out by giving you an idea about what is required in your script. Have you ever heard about the concept of sprites in 3D graphics? One of the most famous 3D sprite applications of the internet world is found in Sonic Robo Blast 2:

By watching this video you see that the character of Sonic, Tails and Knuckles are, when looking at them through the game camera, always visible up-front. In my previous post I have indicated that the "jutsu"-effect you have shown me is made using 3D triangles. Thus it is a matter of orientation so that the triangles are visible up-front, as if looking straight at a sheet of paper.

I hope you still remember from your school days what an euler angle or vector is. In the above image you can see that our vision can be modelled as a cut-out from a sphere based on 3D angle intervals. For you this is important because we want the 3D sprite to be oriented orthogonal to the vision so we see it without tilting/up-front. Now that we have a clear understanding of the model, let's go on to the mathematics.

We first define the viewing vector as the line between the eye and the viewed-at object (subtract the eye position from the billboard middle position). There is a vector called the paper-sheet-direction which is 90 euler angle degrees rotated from the viewing vector (in 2D space).

paper-sheet-direction = ( viewing-dir-y, -viewing-dir-x, 0 ) normalized to length 1

The paper-sheet-direction (psd) and the normalized cross-product between psd and the viewing vector are the vectors that make-up of the texture effect that we are looking for. Here is some code that I quickly made for you:

local function get_billboard_vertices(ox, oy, oz, scale_w, scale_h)
    local vx, vy, vz = getCameraMatrix();
    
    -- Half the scale because we will use it to expand twice, in positive and negative directions.
    scale_w = scale_w / 2;
    scale_h = scale_h / 2;
    
    local vx, vy, vz = ( ox - vx ), ( oy - vy ), ( oz - vz );
    
    local psd_x, psd_y, psd_z = ( vy ), ( -vx ), 0;
    
    local dp_x, dp_y, dp_z = ( vy * psd_z - psd_y * vz ), ( vz * psd_x - psd_z * vx ), ( vx * psd_y - psd_x * vy );
    
    local psd_len = math.sqrt( psd_x * psd_x + psd_y * psd_y + psd_z * psd_z );
    local dp_len = math.sqrt( dp_x * dp_x + dp_y * dp_y + dp_z * dp_z );
    
    local npsd_x, npsd_y, npsd_z = psd_x / psd_len, psd_y / psd_len, psd_z / psd_len;
    local ndp_x, ndp_y, ndp_z = dp_x / dp_len, dp_y / dp_len, dp_z / dp_len;
    
    local obl_x = -npsd_x * scale_w - ndp_x * scale_h;
    local obl_y = -npsd_y * scale_w - ndp_y * scale_h;
    local obl_z = -npsd_z * scale_w - ndp_z * scale_h;
    
    local bottom_left = {
        ox + obl_x,
        oy + obl_y,
        oz + obl_z
    };
    local top_right = {
        ox - obl_x,
        oy - obl_y,
        oz - obl_z
    };

    local otl_x = -npsd_x * scale_w + ndp_x * scale_h;
    local otl_y = -npsd_y * scale_w + ndp_y * scale_h;
    local otl_z = -npsd_z * scale_w + ndp_z * scale_h;
    
    local top_left = {
        ox + otl_x,
        oy + otl_y,
        oz + otl_z
    };
    local bottom_right = {
        ox - otl_x,
        oy - otl_y,
        oz - otl_z
    };
    
    return top_left, top_right, bottom_right, bottom_left;
end

This code has been untested but should contain the things I mentioned above. If you use the "trianglestip" primitive type then you can use the vertices in the same order for the dxDrawMaterialPrimitive3D function. Please try the code and tell me how it works for you!

Good luck!

Edited November 6, 2021 by The_GTA
variable fix thanks to Mkl, scaling adjustment 1/2

[Mkl]

If you prefer it follows the camera instead the player do :

 

_, _, rot = getElementRotation(getCamera())

[Mkl]

 

The_GTA  example works perfectly

I have tested in-game and there is only a little mistake :

local vx, vy, vz = ( ox - cx ), ( oy - cy ), ( oz - cz );

-- instead of 

 local vx, vy, vz = ( ox - vx ), ( oy - vy ), ( oz - vz ); 

 

[The_GTA]

2 minutes ago, Mkl said:

The_GTA  example works perfectly

I have tested in-game and there is only a little mistake :

local vx, vy, vz = ( ox - cx ), ( oy - cy ), ( oz - cz );

-- instead of 

 local vx, vy, vz = ( ox - vx ), ( oy - vy ), ( oz - vz ); 

 

Thank you very much for testing it and telling me about this coding mistake! 

I have fixed the above code.

[Krokara]

how can i be implementing this function?
function: get_billboard_vertices

addEventHandler("onClientRender", root, function()
    pos = {getElementPosition(localPlayer)}
    primitive = {
        {pos[1]+5, pos[2], pos[3]+5,  2, 2},
        {pos[1]-5, pos[2]-5, pos[3]+5, 2 , 3},
        {pos[1]-5, pos[2], pos[3]+5,  3,4 },
        {pos[1], pos[2], pos[3], 4,5}
    }
    dxDrawMaterialPrimitive3D ("trianglestrip", dxCreateTexture("images/kame-ball2.png"), false, unpack(primitive))
end
)

 

Edited November 6, 2021 by Krokara

[Mkl]

For example like this :

addEventHandler("onClientRender", root, function()

    local pos = {getElementPosition(localPlayer)}
    
    local tl, tr, br, bl = get_billboard_vertices(pos[1], pos[2], pos[3], 2, 2)

    primitive = {
        {tl[1], tl[2], tl[3], tocolor(255,0,0)},
        {bl[1], bl[2], bl[3], tocolor(0,255,0)},
        {tr[1], tr[2], tr[3], tocolor(0,255,0)},
        {br[1], br[2], br[3], tocolor(0,0,255)},
    }

    dxDrawPrimitive3D("trianglestrip", false, unpack(primitive))
end
)

I used trianglestrip to draw a rectangle https://wiki.multitheftauto.com/wiki/File:MTAsa_primitives.png

Edited November 6, 2021 by Mkl

[The_GTA]

@Krokara  @Mkl I have adjusted the scaling in the function because I forgot to half it. The scale_w and scale_h parameters are meant to be the world-coordinate units size of the texture.

Edited November 6, 2021 by The_GTA

[Krokara]

2 hours ago, The_GTA said:

@Krokara  @Mkl I have adjusted the scaling in the function because I forgot to half it. The scale_w and scale_h parameters are meant to be the world-coordinate units size of the texture.

Thank you the role follows the character's camera a how I can make the vertices be round?
exemple:

can be done using: dxDrawImage3D?

Edited November 6, 2021 by Krokara

[The_GTA]

4 hours ago, Krokara said:

Thank you the role follows the character's camera a how I can make the vertices be round?

How about you create this textured sphere in a DFF model editor and then import it into the game? Once you are finished then we can talk about how to display it.

[Krokara]

18 hours ago, The_GTA said:

How about you create this textured sphere in a DFF model editor and then import it into the game? Once you are finished then we can talk about how to display it.

if create an object how will do those effects?

[The_GTA]

3 minutes ago, Krokara said:

if create an object how will do those effects?

You could attach a shader onto the object and animate it like that. There are several approaches but you need a "round" 3D model first which is a set of vertices that make things look round.

Else you will always face the problem of billboards that they are just an oriented sheet of paper in 3D space. If you to draw a circle then you should just modify the texture into a circle.

Edited November 7, 2021 by The_GTA

[Krokara]

23 hours ago, The_GTA said:

You could attach a shader onto the object and animate it like that. There are several approaches but you need a "round" 3D model first which is a set of vertices that make things look round.

Else you will always face the problem of billboards that they are just an oriented sheet of paper in 3D space. If you to draw a circle then you should just modify the texture into a circle.

3d round object is already done

[The_GTA]

38 minutes ago, Krokara said:

3d round object is already done

Now I am going to assume that you have got a 3D model file called "sphere.dff" which is textured with texture name "tex". There are multiple approaches now to animate such a model but we are going for the simplest first. For that we want to do the following:

Make use of the MTA RenderWare DFF system by loading our 3D model using engineLoadDFF, requesting a new object model ID using engineRequestModel and then using engineReplaceModel to load the triangles into the new model ID slot. Then we can use the clientside createObject function to put our sphere "3d round object" into the game. After that we can use the community function attachElementToBone to put the sphere onto the hand of the ped inside of an onClientPreRender event handler. Next we would create a simple texture-replace shader using dxCreateShader, attach it onto the sphere object using the engineApplyShaderToWorldTexture function and link our texture, loaded using dxCreateTexture, into it. Last but not least we should cycle through our animation textures as usual while setting each new texture into our shader using the dxSetShaderValue function.

Simple texture replace shader:

texture tex;

technique treplace
{
    pass P0
    {
        Texture[0] = tex;
    }
}

Hope this helps!

Edited November 8, 2021 by The_GTA