Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
​
<!doctype html>
<html>
    <head>
        <title>Editor</title>
        <meta http-equiv="x-ua-compatible" content="ie=9"/>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.4/raphael-min.js"></script>
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
        <script type="text/javascript">
            window.onload = function ()
            {
                var paper = new Raphael(Raphael("container", "100%", "100%"));
                var line = paper.path();
​
                //Get coordinates
                $("svg").mousedown(function (e) {
                    console.log("Mouse down: " + e.offsetX + " " + e.offsetY);
                    var x = e.offsetX;
                    var y = e.offsetY;
                });
                $("svg").mouseup(function (e) {
                    console.log("Mouse up: " + e.offsetX + " " + e.offsetY);
                    var x = e.offsetX;
                    var y = e.offsetY;
                });
​
                paper.set(line);
                line.drag(move,start,up);
                var start = function (x, y, event) 
                {
                    this.ox = this.attr("x");
                    this.oy = this.attr("y");
                    
                },
                    move = function (dx, dy) 
                {
                    this.attr({
                        x1: this.x + dx,
                        y1: this.x + dy
                    });
                    
                },
                    up = function () 
                {
                    
                };
            };
        </script>
    </head>
    <body>
        <div id="container">
            <div id="header" style="margin-bottom: 0;">
                <h1 id="title">Editor</h1>
                <div id="footer"></div>
            </div>
        </div>
    </body>
</html>
​
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers