[SOLVED] How do I convert the mouse click trigger function into touch function for a raycast code

Hello! I’m working on a game with mechanics similar to Dumb Ways to Die for a capstone project at school. The goal for one of the stages it to “pop” or tap on the bubbles with a negative emotion to make it disappear. I tried using raycast and it worked initially when using a mouse click. I tried to convert it to touch (for touchscreen devices) but none of my attempts have worked.

Here are my two codes:

  1. Original raycast code attached to the camera (without the touch function):
var PickerRaycast = pc.createScript('pickerRaycast');

// initialize code called once per entity
PickerRaycast.prototype.initialize = function() {
    this.app.mouse.on(pc.EVENT_MOUSEDOWN, this.onSelect, this);

    this.on('destroy', function() {
        this.app.mouse.off(pc.EVENT_MOUSEDOWN, this.onSelect, this);
    }, this);

PickerRaycast.prototype.onSelect = function (e) {
    var from = this.entity.camera.screenToWorld(e.x, e.y, this.entity.camera.nearClip);
    var to = this.entity.camera.screenToWorld(e.x, e.y, this.entity.camera.farClip);

    var result = this.app.systems.rigidbody.raycastFirst(from, to);
    if (result) {
        var pickedEntity = result.entity;
  1. Disappear code attached to the bubble entities:
var AiDisappear = pc.createScript('aiDisappear');

var bubbleCounter = 0;

// initialize code called once per entity
AiDisappear.prototype.initialize = function() {
    this.factor = 0;

AiDisappear.prototype.pulse = function () {
    this.factor = 1;

// update code called every frame
AiDisappear.prototype.update = function(dt) {
     // Create a ray from the camera to the clicked position
    if (this.factor > 0) {
        this.factor -= dt;
        this.entity.enabled = false;
        bubbleCounter += 1;

I would really appreciate the assistance. Thank you in advance.

You can study how it is done in the tutorial project:

OMG Thank you so much it finally worked! Manifesting you have a good meal today!!

1 Like