संपादित करें: मैंने ऑब्जेक्ट का आकार बदलने या इसके भौतिक प्रकार को बदलने के लिए बाइंडिंग के साथ तीन.जेएस का उपयोग करके वेबजीएल निर्देश का एक पूर्ण उदाहरण बनाया है। इसके अलावा, इस तरह के खिड़की का आकार बदलने और माउस के रूप में की घटनाओं में ले जाया गया:
हाँ यह बहुत संभव है। मेनू, लीडरबोर्ड आदि से परे आप अपने canvas को निर्देश में भी लपेट सकते हैं।
- नियंत्रक सेटअप खेल राज्य
- पास इस राज्य, सर्वर और किसी भी अन्य डेटा से लोड डेटा आप निर्देश
- अंत में आप निर्देशों लिंक समारोह में कैनवास init करना पड़ सकता है जाएगा
मैंने स्कूल प्रोजेक्ट के साथ मेरी सहायता करने के लिए यह छोटा ऐप बनाया: http://callmethey.herokuapp.com/polygons।
app.directive('polygon', function() {
return {
restrict: 'A',
scope: {
vertices: '=polygon',
color: '=color'
},
link: function(scope, element, attrs)
{
var camera, scene, renderer;
var polygon;
var targetRotation = 0;
var targetYRotation = 0, targetXRotation = 0;
var targetYRotationOnMouseDown = 0, targetXRotationOnMouseDown = 0;
var mouseX = 0, mouseY = 0;
var mouseXOnMouseDown = 0, mouseYOnMouseDown = 0;
var width = $(element).width();
var height = 200;
var widthHalfX = width/2;
var widthHalfY = height/2;
init();
function init() {
// Setup scene
camera = new THREE.PerspectiveCamera(70, width/height, 1, 1000);
camera.position.x = 0;
camera.position.y = 0;
camera.position.z = 300;
scene = new THREE.Scene();
// Build Polygon
var geometry = new THREE.Geometry();
angular.forEach(scope.vertices, function (v) {
geometry.vertices.push(new THREE.Vector3(v.x, v.y, v.z));
});
geometry.faces.push(new THREE.Face3(0, 1, 2));
THREE.GeometryUtils.center(geometry);
// Push polygon to scene
var material = new THREE.MeshBasicMaterial({ color: cols[scope.color], side: THREE.DoubleSide });
polygon = new THREE.Mesh(geometry, material);
scene.add(polygon);
renderer = new THREE.WebGLRenderer();
renderer.setSize(width, height);
}
// ..... rest of the code truncated for readability
};
});
WebGL निर्देशों, इस होना करने के लिए भविष्य – jolySoft
आपका उदाहरण न मैक पर क्रोम में काम किया है। इन त्रुटियों को फेंक दिया गया है: वेबजीएल संदर्भ बनाने में त्रुटि। three.min.js: 412 टाइपरर: शून्य – BuildingJarl
की विधि 'getExtension' को कॉल नहीं कर सकता है कोरम ऑटो कभी-कभी अद्यतन पर WEBGL अक्षम करता है। यह पुरानी पीढ़ी के मैकबुक के लिए एक मुद्दा प्रतीत होता है। सुनिश्चित करें कि क्रोम: // झंडे/# अक्षम-वेबग्ल 'अक्षम' है और यह फिर से काम करना शुरू कर देगा। – winkerVSbecks