Forum

User posts aalavandhaann
01 April 2017 03:07
#16300
aalavandhaann
Yuri,

Sorry for having raked up this oldest thread. I was desperate to add visual lines between particles that are closer to each other. Hence I was trying to find a way to do this using Blend4Web. Is there a way in Javascript to access the location of particles during runtime? So that I can check if they are in proximity then draw lines between them.

Regards,

#0K
01 April 2017 00:47
#16299
aalavandhaann
Roman,

Curious about one more thing as it looks like you have a vast knowledge of Blend4Web. Is it possible to create pointclouds or particles using a custom javascript library like SparkJS? I mean take the threejs rendering out and replacing with Blend4web.

Thereby If there is a pointcloud library in Blend4web I can run the spark js particle library and update the position of point clouds manually. I already started a topic on this discussion 
https://www.blend4web.com/en/forums/topic/3193/
but sadly nobody seems to be answering it. Hence trying to seek your help if your time permits.

Regards,

#0K
31 March 2017 22:34
#16297
aalavandhaann
Will it be possible to integrate something likes this into Blend4Web? 

http://vincentgarreau.com/particles.js/


Regards,

#0K
31 March 2017 22:18
#16296
aalavandhaann
Roman,

I think its time to close this thread. Completely answered. Especially your last statement on 
<div id="canvas3d" style="position:absolute;width:100%;height:100%;"></div>
made me feel lame. Of course this is what happens when you dive into academics leaving your web skills back years ago, .

Many many thanks.

Regards,

#0K
31 March 2017 06:48
#16281
aalavandhaann
Dear Brothers and Sisters,

I come from a THREE js background originally and wish to take a minute in appreciating the efforts of Blend4Web team in what they have accomplished. Hats off to everyone who have contributed this wonderful, seamlessly performing 3D engine. You guys are make lives easier and 3D on a Nirvana level.

Now coming to my domain of doubts. In THREE.js there is a THREE.Points class to render custom point clouds to achieve effects on par with particles but not strictly particles. I wish to do something similar using Blend4Web but I am quite clueless on how to do this.

To be particular I am trying to achieve this effect originally done using THREE.js Draw Calls: THREE.JS

What did I try? I create a mesh with 'Halo' material in an attempt to modify the vertex positions at run time to achieve the same effect as you would see in the above url. Then use an 'Empty' object to draw lines based on my requirement. The main hassle here is to modify the vertices of a mesh.

Can someone please guide me on this? Sorry if this was a basic question. Thanks in advance to all the guides out there.

Regards,

#0K
31 March 2017 00:15
#16278
aalavandhaann
Roman,

Many thanks for your time and effort to help me out. So what you mean to say is that 'autoresize' is for the canvas and not the container (the div element)? So it is necessary to write our own js listener and resize div element accordingly to change the div container size accordingly? Because as of now that is how I have solved the problem by writing a javascript method to handle resizing of canvas element based on the containing div element.

Regards,

#0K
29 March 2017 21:05
#16261
aalavandhaann
Firstly, Thanks a lot Roman Semenstov for have lent your ears to my problem. I am attaching the project files with this message.

Blender version: 2.76
Blend4Web version: 17.02.1
OS: Ubuntu Unity 14.04
Browsers tested: Chrome-Version 49.0.2623.110 (64-bit)

I was wondering why the autoresize is not working? Also by default the window size takes up 320x240, unless specified in a css the explicit width and height. But again explicit width and height would be a problem because one would wish the canvas3d to take up the available window: width and height.

Kindly let me know if I have missed any other details.


Regards,

#0K
29 March 2017 15:30
#16256
aalavandhaann 
<div id="container_id" style="width:1024px;height:768px"></div>
Is also not working.

But why does the 
autoresize:true,
not work at all?
29 March 2017 08:25
#16250
aalavandhaann
Dear Brothers and Sisters,

I am a newbie to Blend4Web. I downloaded the blend4web (addon and SDK 17.0.2) and created my first hello-world snippet using a model created with Blender 2.76. When I publish it as HTML it all works like charm as expected. However when I try to publish the JSON thus to create my own Javascript app things are not working the way it should be.

The JSON loads fine and also the camera controls are working without any issues, however the problem is the size of the canvas. No matter how much I try to change the canvas to fit the size of the screen, it is not working. I am sure that there are some mistakes but cannot identify what it is.

The javascript is as follows:

"use strict";
b4w.register("hello-world", function(exports, require) {
//import modules used by the app
var m_main = require('main');
var m_app       = require("app");
var m_cam       = require("camera");
var m_cont      = require("container");
var m_data      = require("data");
var m_mouse     = require("mouse");
var m_obj       = require("objects");
var m_scenes    = require("scenes");
var m_config = require('config');

exports.init = function() {
    m_app.init({
        canvas_container_id: "container_id",
        callback: init_cb,
        physics_enabled: false,
        alpha: false,
        background_color: [0.0, 0.0, 1.0, 0.0],
        autoresize:true,
        show_fps:true
    })};

function init_cb(canvas_elem, success) {

    if (!success) {
        console.log("b4w init failure");
        return;
    }
    console.log('INITIALIZATION SUCCESS');
    load_cb();
}
    
function load_cb() {
    m_data.load("models/hello-world.json", loaded_cb);
}

function loaded_cb() {
    m_app.enable_camera_controls();
}
});
b4w.require("hello-world").init();


The html code is as follows:

<script src="js/libs/b4w.min.js"></script>
<body>
    <div id="container_id" style="width:1024px;height=768px"></div>
</body>


Another thing, I am just using the addon and not using the SDK to publish my JSON. Can someone tell me where am I going wrong?

Regards,

#0KSelection_009.png