WorldViz User Forum  

Go Back   WorldViz User Forum > Vizard

 
 
Thread Tools Rating: Thread Rating: 13 votes, 5.00 average. Display Modes
Prev Previous Post   Next Post Next
  #1  
Old 09-06-2012, 08:37 AM
goro goro is offline
Member
 
Join Date: May 2012
Posts: 33
Transfer Image Data using Web Sockets

I am trying to send Image data captured with vizcapture using Web Sockets. I am not expert with computer networks or network protocols but done this work using Vizard Help, Help from World Viz Forum & HTML5 Tutorial from W3Schools. When I run the code and open HTML 5 supporting web browser, Google Chrome in my case with url http://localhost:8080/vizhtml/websocket for local host it runs fine for some time. Bellow is the code given:

Code:
import viz
import vizhtml
import vizact
import vizcapture

viz.setMultiSample(4)
viz.fov(60)
viz.go()

import vizinfo
info = vizinfo.add('This script demonstrates how to add multiple windows.\nThe upper right window is a rear view of the scene\nThe upper left window is a birds eye view')
info.translate([0.95,0.05])
info.alignment(vizinfo.LOWER_RIGHT)

#Add environment
viz.addChild('maze.osgb')

# Create a new window in the upper left corner
UpperLeftWindow = viz.addWindow(pos=(0,1.0),size=(0.2,0.2))
UpperLeftWindow.visible(0,viz.SCREEN)

#Create a new window in the upper right corner
UpperRightWindow = viz.addWindow(pos=(0.8,1.0),size=(0.2,0.2))
UpperRightWindow.visible(0,viz.SCREEN)

# Create a new viewpoint
BirdView = viz.addView()

#Attach the bird's eye view to the upper left window
UpperLeftWindow.setView(BirdView)

#Move the view above the center of the room
BirdView.setPosition([0,25,0])

#Rotate the view so that it looks down
BirdView.setEuler([0,90,0])

#Create another viewpoint
RearView = viz.addView()

#Attach the rear view to the upper right window
UpperRightWindow.setView(RearView)

#Increase the field-of-view for both windows
UpperLeftWindow.fov(60)
UpperRightWindow.fov(60)

#Add an arrow marker to bird's eye view window to represent our current position/orientation
arrow = viz.addTexQuad(parent=viz.ORTHO,scene=UpperLeftWindow,size=20)
arrow.texture(viz.add('arrow.tif'))

# Web Socket & HTML 5 Code
code = """
<html>
<head>
    <title>vizhtml WebSocket Example</title>
    <script type="text/javascript" src="vizhtml.js"></script>
</head>
<body>
<canvas id="VizardScreen" width="180" height="140" style="border:1px solid #d3d3d3;">
Your browser does not support the HTML5 canvas tag.</canvas>
<script language="javascript">

var socket = new VizardWebSocket();
var c=document.getElementById("VizardScreen");
var ctx=c.getContext("2d");
var imgData=ctx.createImageData(160,120);

socket.onevent('open', function(e){
    document.getElementById('status').innerHTML = 'connected';
    document.getElementById('my_button').disabled = false;
})

socket.onevent('close', function(e){
    document.getElementById('status').innerHTML = 'waiting for connection';
    document.getElementById('my_button').disabled = true;
    socket.reconnect();
})

socket.onevent('set_time', function(e){
    document.getElementById('script_time').innerHTML = e.data.time;
})

socket.onevent('set_data', function(e){
var j = 0;
for (var i=0;i<imgData.data.length;i+=4)
  {
  imgData.data[i+0]=e.data.iData[j+2];
  imgData.data[i+1]=e.data.iData[j+1];
  imgData.data[i+2]=e.data.iData[j];
  imgData.data[i+3]=255;
  j+=3;
  }
ctx.putImageData(imgData,10,10);
})

var click_count = 0;
function onButtonClick()
{
    click_count += 1;
    socket.send( 'button_click' , VizardData({'count':click_count}) );
}

</script>

<div>Status:</div><div id='status'>waiting for connection</div></br>
<div>Time:</div><div id='script_time'></div></br>
<div><input id='my_button' type=button value="Send Message" onclick="onButtonClick();"></div></br>

</body>
</html>
"""

# http://localhost:8080/vizhtml/websocket
vizhtml.registerCode('websocket',code)

def ClientConnect(e):
    print 'Client connected at',e.client.address
vizhtml.onConnect(ClientConnect)

def ClientDisconnect(e):
    print 'Client disconnected at',e.client.address
vizhtml.onDisconnect(ClientDisconnect)

def SendTime():
    d = viz.Data(time='%.1f'%(viz.tick()))
    vizhtml.sendAll('set_time',d)
vizact.ontimer(0.1,SendTime)

def OnButtonClick(e):
    print 'BUTTON CLICK',e.data.count,'from',e.client.address
vizhtml.onMessage('button_click',OnButtonClick)

def SendImageData():
    width,height,data = vizcapture.screenBuffer(flip = True)
    lendata = len(data)
    print lendata
    iData = []
    for j in range (120):
        for i in range(160):
            iData.append(ord(data[800*3*5*(j-1)+3*5*(i-1)]))
            iData.append(ord(data[800*3*5*(j-1)+3*5*(i-1)+1]))
            iData.append(ord(data[800*3*5*(j-1)+3*5*(i-1)+2]))
    d = viz.Data(iData = (iData))
    print len(iData)
    vizhtml.sendAll('set_data',d)
vizact.ontimer(0.1,SendImageData)

def UpdateViews():

    #Get the current head orientation and position
    yaw,pitch,roll = viz.MainView.getEuler()
    pos = viz.MainView.getPosition()
       
    #Move the rear view to the current position
    RearView.setPosition(pos)

    #Rotate the rear view so that it faces behind us
    RearView.setEuler([yaw+180,0,0])

    #Move arrow to our current location
    x,y,z = UpperLeftWindow.worldToScreen(pos,mode=viz.WINDOW_PIXELS)
    arrow.setPosition([x,y,0])
    arrow.setEuler([0,0,-yaw])

vizact.ontimer(0,UpdateViews)

# Turn on collision detection so we can't go through walls
viz.collision(viz.ON)
This is the output which I get:


Now the issues are:
1. When I run this code for certain time it starts throwing errors
Traceback (most recent call last):
File "C:\Program Files\WorldViz\Vizard4\python\vizact.py", line 3606, in __ontimer
val = event.call()
File "C:\Program Files\WorldViz\Vizard4\python\vizact.py", line 3379, in _callStatic
return func(*args,**kwargs)
File "C:\Documents and Settings\User\Desktop\screenCapture\screenCapture. py", line 142, in SendImageData
iData.append(ord(data[800*3*5*(j-1)+3*5*(i-1)]))
IndexError: string index out of range
2. Here I am reducing the resolution from 800 x 600 to 160 x 120 but if I don't do that my for loop runs for 800 x 600 x 3 = 1440000 times for single update. That slows down the performance of the system.

Please help me resolving these two issues.
Thanks!
Reply With Quote
 

Thread Tools
Display Modes Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
Use saved text file data as replay sources problem mizutani_jun Vizard 4 10-14-2010 04:49 PM
Using 5DT plug-in with the data coming through network... mcicek Vizard 1 05-18-2009 05:17 PM
two continuous sockets timbo Vizard 6 07-09-2008 10:16 AM
tracking using quaternarion data jfreeman Vizard 2 06-01-2005 08:48 AM


All times are GMT -7. The time now is 11:00 PM.


Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2019, vBulletin Solutions, Inc.
Copyright 2002-2018 WorldViz LLC