Jump to content

Search the Community

Showing results for tags 'texture change on click'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • HTML5 Game Coding
    • News
    • Game Showcase
    • Facebook Instant Games
    • Web Gaming Standards
    • Coding and Game Design
    • Paid Promotion (Buy Banner)
  • Frameworks
    • Pixi.js
    • Phaser 3
    • Phaser 2
    • Babylon.js
    • Panda 2
    • melonJS
    • Haxe JS
    • Kiwi.js
  • General
    • General Talk
    • GameMonetize
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered
    • Marketplace (Sell Apps, Websites, Games)

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Website URL


Twitter


Skype


Location


Interests

Found 1 result

  1. Good Morning. I'm new to Babylon JS and JavaScript. When I click on the Kayak in the scene the texture changes from a peach texture to the blue wave texture, which is perfect. However the Normals seem to flip. I have no idea why this is happening. Should I use different code to achieve the texture change on click? Thanks. window.addEventListener("DOMContentLoaded", function() { var canvas = document.querySelector("#renderCanvas"); // Load the BABYLON 3D engine var engine = new BABYLON.Engine(canvas, true); // ------------------------------------------------------------- var createScene = function () { // This creates a basic Babylon Scene object (non-mesh) var scene = new BABYLON.Scene(engine); BABYLON.SceneLoader.ShowLoadingScreen = false; scene.collisionsEnabled = true; // glTF Files use right handed system scene.useRightHandedSystem = true; scene.clearColor = new BABYLON.Color3(0.99, 0.99, 0.99); scene.debugLayer.show(); var camera = new BABYLON.ArcRotateCamera("Camera", 4.712, 1.571, 0.05, BABYLON.Vector3.Zero(), scene); camera.setPosition(new BABYLON.Vector3(85, 55, -115)); camera.attachControl(scene.getEngine().getRenderingCanvas()); camera.minZ = 0.01; camera.maxZ = 1000; camera.lowerBetaLimit = 0.1; camera.upperBetaLimit = (Math.PI / 2) * 0.99; // This creates a light, aiming 0,1,0 - to the sky (non-mesh) var light = new BABYLON.HemisphericLight("light1", new BABYLON.Vector3(0, 1, 0), scene); // Default intensity is 1. Let's dim the light a small amount light.intensity = 1; // Append sample glTF model to scene var myKayak; BABYLON.SceneLoader.Append("./models/", "Kayak.gltf", scene, function (newMeshes) { }, null, function (newMeshes) { myKayak.checkCollisions = true; myKayak.ellipsoid = new BABYLON.Vector3(10, 1, 5); }); /// Click to Change Texture /// var BWTexture = new BABYLON.StandardMaterial("BlueWave", scene); BWTexture.diffuseTexture = new BABYLON.Texture("models/BlueWave.png", scene); scene.onPointerPick = function(evt, pickInfo) { if(pickInfo.hit) { if (pickInfo.pickedMesh != null){ alert(pickInfo.pickedMesh.name); pickInfo.pickedMesh.material = BWTexture; } } } return scene; }; // ------------------------------------------------------------- var scene = createScene(); engine.runRenderLoop(function () { scene.render(); }); window.addEventListener("resize", function () { engine.resize(); }); });
×
×
  • Create New...