Integrating plas.io pointcloud viewer into my own web app - point-clouds

I am experimenting with plas.io to display pointclouds in LAS format. This is a brilliantly good piece of work using WebGL.
I want to integrate plas.io into an existing node app. It would be best to have the display (of the model, not the controls) built right into my current UI. The LAS file in question comes from S3. Are there hooks/APIs which I can use to accomplish such a thing?
It would also be acceptable to have plas.io running in a iframe in my app. I would run a separate plas.io server. However, I would like the iframe to display only the model again, not the controls, and pass in both the file to be rendered and the parameters to render it somehow, perhaps as query parameters to a URL handed off to plas.io.
I have posted this question to the Issues section of plas.io's github page, but no response. Any ideas about how I should proceed here?

Related

Docpad design considerations

I'm coming from a php/mysql background. I'm most familiar with the Kohana PHP framework and I'm trying to learn Docpad. I have a loose understand at this point and I've built out my first website and blog. Static content makes a lot of sense to me on Docpad.
I'm working on my photography site where I want to be able to upload new images to a portfolio. The backend needs to handle an uploaded high-resolution image and create several different copies at different resolutions of the image. My biggest question is how do I keep track of the image meta data that I want to display? Do I generate a physical file for each image that has all the particulars I want to track and use those files as my searchable database, much like how blog posts are setup?
Or should I go the route of using something like MongoDB to store image data there where it can be queried and plugged into a layout?
Regarding handling POST or GET data, should I be reading up on the express.js docs? I'm not really sure where to turn for that.
Wordpress uses TimThumb to re-size it's images: How does WordPress.com resize images dynamically?
Then there is this re-sizing library for node: node package for file attachments and image resizing
If you wanted to created like 3 different image sizes and use the backbone collection in DocPad, then you'd add your different re-sized images to those three different collections/folders. For access the images you might just be able to do it via it's file name. So when you copy, re-size and rename the image, in the rename step, concat the image size at the end, like: coolPhoto-med.jpg and then you could just do hard links to get to the image like /spring-collection/med/coolPhoto-med.jpg or you could use query engine to access them.
The file model has a meta attribute: https://github.com/bevry/docpad/blob/master/src/lib/models/file.coffee#L17
I've yet to learn how to use it yet though.
I know we chatted yesterday on #docpad IRC but I just wanted to answer you here too. If you do code something that re-sizes images for DocPad, please do consider putting it up on Github to share with the community.

Spring web mvc 3.0 Form data and image upload issue

I am new to spring and JSP. My web application is spring powered, which I run locally in apache tomcat.
In my JSP page I have multiple file-upload inputs and many text input fields.
Every time, when I press any of the upload buttons, a HTTP POST request goes to my controller from where on I may save the image to the database.
But, what I want is:
I will upload the images one by one ( preferably by staying in the page) but won't save them in database and then when I press submit to get the rest of the input text fields data, I commit all the data, including image, texts to the database in one try.
I have heard of scope="session" for my controller(bean) in the dispatcher-servlet.xml ... but I am unsure as to if I upload image to my controller and get back to my JSP form, will the bean keep my already uploaded images?
I think it is hard for me to explain, so please let me know if my question is not clear.
It would be nice if anybody can come up with a suggestion that may help to obtain my goal.
Are you uploading a varying number of images, as in if someone wants to upload only 2 they'll have 2 file fields on the form, or does everyone get 5 fields for example?
To be honest, the whole scheme of incremental upload sounds a bit overcomplicated at this stage. (Unless you have an explicit need to show progress bars on each upload, etc.) What if the user abandons the form after uploading the first image? You'd need a pretty solid mechanism to keep track of the entire visit, keeping it in the session wouldn't help here. Can a user pick up where they left off? If you make the whole thing work with single form submit click first, you can break it out and fine tune the process later. I mention that since you stated you're new to jsp and Spring (what's your experience with web dev otherwise?)
I think the best way is to upload file using ajax control rather than submitting form for each upload and store the file references in session scope variable(attribute). there are lot of libraries have ajax based file uploading like extJS, JQuery, GWT, DWR , whatever ajax library you are using in your web application.

ExtJs: best practices to handle images saving/retrieval

We are developing a web application with ExtJs 4 and Microsoft RIA services + MS SQL Server on the back end. Currently some of the records we store in the DB have attached images to them. Images are stored in binary format in the DB.
What would be the best approach to:
Display them within ExtJs framework
Allow users to upload images via same ExtJs front end
I looked through ExtJs docs and looks like we would need to provide images as basically individual files and use simple img tag for that. Is that correct assumption? Are there other approaches to render images from binary data (which we currently serve via JSON endpoints)?
Is there samples handy for image upload logic?
ExtJS will give you a framework for getting the images via forms to your back end, but what you do with the images from there is completely ExtJS independent. Displaying them within ExtJS is completely independent of the back end logic as well. It's just a matter of finding a way to pipe the data up to the browser just as you would if you were writing a normal HTML page.
I'll take the answer one step further and mention: Storing images in the database is generally a bad idea. At least, storing them in a relational database is generally not a great plan. If I couldn't use a database like Riak (or Amazon's S3) for storing the images, I would probably follow Diodeus' comment and put them directly in the filesystem.

Implement drag-and-drop using AJAX in CakePHP

I wish to create a drag and drop feature for adding profile picture using CakePHP. Are there any samples which I can follow or a step by step guide?
I sourced many samples online but none of them cater for CakePHP.
I basically need a simple drag n drop for users to drag their profile image and the URL of the image is reflected in the database. The user will be able to edit another profile image. What approach should I use for this?
what you want to do is mostly about front-end, the back-end is generic server handling (in this case, PHP upload handling) and has little to do with Cake. That's why you don't see a specific cake tutorial for this. So, look up jquery drag drop and ajax upload. You'll also need to understand Cake rather well (well enough to adapt those online sample code to your Cake app).
I recommend you to use jQuery UI's draggable and droppable interactions.
Integrating them in CakePHP is quite easy, just follow the manual instructions to include Javascript files in a CakePHP application.
Finally, updating the database to reflect the URL of the image can be easily done with jQuery as well, using the AJAX related methods (e.g. post).

Dynamically updated graphs on a web page - howto?

I need to understand a good way to design a web page with dynamically updated graphs. It should be something close to what stock market graphs look like (e.g. Google Finance), although with a bit more complicated functionality, which is not the point. Naturally I am thinking of writing an ajaxy-style flash control, which would communicate with the server through, okay, something like XMLHttpRequest, but from within flash code, and draw things basing on data received. Is this doable with flash? Does security model allow such kind of client-server interaction? If yes, could you think of any references for me to get started (similar opensource projects, articles, whatever)? Or should I forget about flash and use a Java applet right away?
An important thing to note: I don't think I can use Google charting API, because I need also to have user interaction. In the link above to Google Finance the user can drag the graph to and forth with the mouse, that's close to what I need (I will also need to implement some actions from the dropdown menu).
Thanks for your answers and opinions!
Try this: JQuery Flot
Flot is a JQuery plugin to plot graphs. You keep replotting in-place with the latest data at the desired frequency to generate a dynamically updated graph. It is based on the <canvas> tag. We use it successfully to generate pretty complex dynamically updated graphs in our applications. The updates are fetched via periodic AJAX calls.
Another alternative is YUI Charts
We did not explore this a lot but this uses Flash and AJAX like you wanted to do.
/RS
I have used the Google Charts API to do this sort of thing. For a simple example, see my Sunrise and Sunset page. This page calculates sunrise and sunset times for a given latitude and longitude, all in Javascript, then uses the Google Chart API to replace the graph on the page with the requested data.
Update: The Stack Overflow reputation graph (see your user page) isn't Flash and yet allows interactive dragging. (Click and drag on the left to update the posts on the right that reflect the highlighted reputation region.) Perhaps you could look at how that is implemented.
You have described Flex...
This is very possible in flash.
You can use the URLLoader class to obtain data from a server at run time and the draw your graph using a custom control. In actionscript3 you'd subclass the Shape class and write a little drawing code to draw your graphs. Flash has support for drawing and filling so it would probably be very good at this.
The flash client can poll the server for updates. Or if you want a "live" connection you can establish a socket connection to the server and let the server push updated data live. Flash is good for this as you can push XML data over the socket and use the built in support for processing the XML, or you can send binary data just as easily.
As for the security model it's just the standard flash one. You can make network connections back to the server that the swf file came from with no issues. If you want to make a connection to a different server then that server needs to give your client permission to connect to it by hosting a crossdomain.xml file
I'm not sure about the Flash side of things, but this would be pretty simple to do in Silverlight. I am pretty sure you'd easily be able to make a server request in Flash too.
I'd do some searching for long polling.

Resources