Web Based Map Generations of

Mobile Robot Movement using SVG

Harindra W Pradhana, Achmad Widodo, Suryono

wisnu@msi.undip.ac.id, awid@undip.ac.id, suryono@undip.ac.id

Content

Introduction

Mobile Robot Movement

Map Preparation

Data Preparation

Map Transformation

Map Generation

Data Processing

Data Plotting

Testing demo

Conclusion

Introduction

Vectors : Component &

Addition Backgrounds

Visualise robotic

movement

Vector representing

robotic information

Vector resultant

calculation for latest robot

position & orientation

Mobile Robot

Movement

• Continuous Discrete

• Each step represented as

vector

• Each movement vector

start at the end of previous

vector

l n=√(∑x=1

x=n

l xsin θ x)2

+(∑x=1

x=n

l xcosθ x)2

θn=tan−1

(∑x=1

x=n

l x sin θx )

(∑x=1

x=n

l x cosθ x)

βn=∑x=1

x=n

θ x

Map Preparation

Data Preparation Map Transformation

Calculate every robot

position

Find minimum and

maximum point on map

Calculate map size & ratio

Polar Cartesian SVG

If Rmap > Rdraw

If Rmap < Rdraw

TransformationR=

W

H

T=

W draw

W map

P y=[H draw−(T×H map)]

2

T=

H draw

H mapPx=

[W draw−(T ×W map)]

2

X draw=T (X map−X min)+M +Px

Y draw=H draw−T (Y map−Y min)+M−P y

Map Generation

Data Processing Plotting

Process Flow

Recap & Convertion

Transformation

Robot <polygon points="X-5,Y+7 X,Y-7

X+5,Y+7" fill="yellow"

stroke="black" stroke-width="1"

transform="rotate(-β X,Y)" />

Path <path d="M X1 Y1 L X2 Y2 L X3 Y3

... L Xn Yn" marker-

mid="url(#Triangle)"

fill="none" stroke="black" />

Testing Demo

Dataset 1 Dataset 2

Conclusions & Suggestions

Conclusions Sugestions

Robot data can be

visualized using XML tags

in SVG form

Robot movement step can

be represented as vector

Robot final position is the

resultant of all movement

vector

3D map

Map feature

Zoom

Rotate

Multiple robot

SLAM

Thank You