How to get Raphael.js in my blaze project visible?


#1

Hi all,

I tried multiple libraries and approaches but I do not get a graph visible. I do see it in my html, no errors in console, but nothing is visible… Any ideas on how to get a simple example working?

My trials and code are here SOLVED: Sequence diagram in meteor: Cannot read property '_actors_height' of undefined

Thanks


#2

Here are a few steps to get a dead simple raphael.js example working with Meteor/Blaze:

  1. meteor create raphael-test

  2. cd raphael-test; meteor npm install

  3. Create a /client/compatibility directory.

  4. Download the raphael.js file, storing it in /client/compatibility/raphael.js.

  5. Start your app.

  6. Replace your /client/main.html file with:

<head>
  <title>raphael-test</title>
</head>

<body>
</body>
  1. Replace your /client/main.js file with:
import { Template } from 'meteor/templating';

import './main.html';

Template.body.onRendered(function onRendered() {
  const paper = Raphael(10, 50, 320, 200);
  const circle = paper.circle(50, 40, 10);
  circle.attr('fill', '#000');
  circle.attr('stroke', '#fff');
});
  1. When your app refreshes, you should now see:


#3

Hi @hwillson, I merge this issue with SOLVED: Sequence diagram in meteor: Cannot read property '_actors_height' of undefined

Both you and Rob suggested the same solution, and still it does not work.

I think the issue is lodash, so how to ensure I use underscore for this chart…?