Crosshair compatibility

cl_crosshairalpha "200"
cl_crosshaircolor "5"
cl_crosshaircolor_b "50"
cl_crosshaircolor_r "50"
cl_crosshaircolor_g "250"
cl_crosshairdot "0"
cl_crosshairgap "0"
cl_crosshairsize "5"
cl_crosshairstyle "4"
cl_crosshairusealpha "1"
cl_crosshairthickness "87.5"
cl_fixedcrosshairgap "0"
cl_crosshair_outlinethickness "0"
cl_crosshair_drawoutline “0”

this is a crosshair scrpit for a third person

These are from CS:GO and therefore don’t apply to the PlayCanvas engine.

yes these are crosshair generator
any other suggestions

What do you need suggestions for? Making a crosshair generator?

there must be a way to get crosshair, show I use a 2D screen as with UI?

You could do that, make an image element with a cross and keep centered under a 2D screen.

same with the camera
needing to have a camera follow

and the health bar inserted seems to be offset

then the element text which is in the perspective 'Top’
is lacking visibility

Can you share the project please?

https://playcanvas.com/editor/scene/574860

TRY THIS SCRIPT:

pc.script.create(‘crosshair’, function (context) {
var Crosshair = function (entity) {
this.entity = entity;
};

Crosshair.prototype = {
    initialize: function () {
        var template = [
            '<div id="crosshair">',
            "<img src='data:image/png;base64,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'/>",
            '</div>'
        ].join('\n');

        this.canvas = document.getElementById('application-canvas');
        var container = document.getElementById('application-container');
        this.crosshair = document.createElement('div');
        this.crosshair.id = 'crosshair';
        this.crosshair.innerHTML = template;
        this.crosshair.style.cssText = 'opacity:0.5;position:absolute;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-o-user-select: none;user-select: none;display:none';
        container.appendChild(this.crosshair);

        window.addEventListener('resize', this.resize.bind(this), false);

        this.resize();
    },

    resize: function () {
        this.crosshair.style.left = (this.canvas.offsetWidth / 2) + 'px';
        this.crosshair.style.top = (this.canvas.offsetHeight / 2) + 'px';            
    },
    
    enable: function () {
        this.resize();
        var el = document.getElementById('crosshair');
        if (el) {
            el.style.display = 'block';    
        }
    },

    disable: function () {
        var el = document.getElementById('crosshair');
        if (el) {
            el.style.display = 'none';    
        }
    }
};

return Crosshair;

})

it gives a sort of 2d screen and says Illegal Statment, no crosshair though

You will need a crosshair component though which is not hard to get but it is meant for a tps and is from an excellent tps playcanvas example i got a couple years back trust me it works

What kind of game is this going to be?

here’s a link, it’s a hack and slash
https://playcanvas.com/editor/scene/574860

the tps is for third person shooter right? the actual animation comes from a shooter (adding bow and arrow)

is there a blender for it?

Whoa dont worry im already there but your game has hella errors so before you start adding bows and arrows and multiplayer and what not you need a camera movement and need to fix you animation error and yes ntps for third person shooter

yes the bows and arrows will defintely come later
it’s not multiplayer
i’m doing a camera follow
https://developer.playcanvas.com/ja/tutorials/legacy/advanced/fps-controller/

you have a script error in the animation blending

haha yes
that one, the .json is supposed to flow in to Great Sword Slash on key input P
so close to getting it

Do you need help? if it ok with you i could help

yes please