CODEWITHSUNDEEP
javascriptjqueryraphael
BeYourOwnGod
BeYourOwnGod

Reputation: 2425

How do I place the Raphael JS generated output into a specific div on my page?

Im a newbie at Raphael and am trying to get the results of the "Tiger" into a div. See my example below:

<script src="js/raphael.js"></script>
<script src="js/tiger.js"></script>

    <script>
        window.onload = function () {
            Raphael("holder", "100%", "100%");
            var paper = Raphael(tiger);
            var tfm = 'S0.5,0.5,200,200';

            paper.forEach(function (obj) {
                obj.transform(tfm);
            });
            // now place the tiger into the div below...
        };
    </script>

<div id="holder"></div>

How do I accomplish this? The tiger renders just fine, but seems to be a big layer on top of everything else so my other buttons on the page dont work -- even though the tiger image itself is not over the buttons. I want the tiger to be in the div and my other controls to not be overlaid.

Upvotes: 0

Views: 190

Answers (1)

istos
istos

Reputation: 2662

Here is an example: http://jsbin.com/ecedeg/3/edit

  var paper = Raphael("holder", "300", "300");
  var tfm = 'S0.5, 0.5, 200, 200';
  paper.add(tiger);

  paper.forEach(function (obj) {
    obj.transform(tfm);
  });

Upvotes: 1

Related Questions