The SVG path element is used for drawing complex shapes in the SVG path specification. It is the most complex element for drawing built-in shapes.
Paths represent the geometry of the outline of an object using commands. They take a single attribute to describe what to draw.
In SVG the path element is represented by <path d=”” /> d will take the path string.
In RaphaelJS, the path string is given to the library to handle drawing.
Setup
We will use a grid of 500 by 500 pixels to cover the topic of paths. The code to create the grid is given below:
<html>
<head>
<title>Paths Arrow Absolute</title>
<style>
#container {
clear:both;
width:500px;
height:500px;
background:url(grid.jpg) repeat;
display: block;
margin: 0 auto;
}
</style>
</head>
<body>
<div id=”container”></div>
<script src=”https://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script>
<script>
paper = Raphael(‘container’, 500, 500);
// Write code here
</script>
</body>
</html>
#javascript #scalable-vector-graphics #programming #web-development #raphaeljs
1.25 GEEK