Skip to content

Instantly share code, notes, and snippets.

@aaizemberg
Last active August 29, 2015 14:01
Show Gist options
  • Save aaizemberg/29982f838df487daaa72 to your computer and use it in GitHub Desktop.
Save aaizemberg/29982f838df487daaa72 to your computer and use it in GitHub Desktop.
Ejemplo usando Raphaël
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script>
<style>
#scatterplot
{
width:900px;
height:400px;
box-shadow: 5px 5px 2px #888888;
border:1px solid #d3d3d3;
}
</style>
<script>
function dibujar() {
var w = 900;
var h = 400;
var paper = Raphael(document.getElementById("scatterplot"), w, h);
var circulos = new Array();
for (var i=0; i < 100 ; i++) {
circulos[i] = paper.circle(Math.random() * w, Math.random() * h , 20);
circulos[i].attr("fill", "#f50"); // color
circulos[i].attr("stroke", "#fff"); // color del borde
circulos[i].attr("stroke-width", "3"); // ancho del borde
circulos[i].attr("fill-opacity","0.5"); // opacidad [0,1] del relleno
circulos[i].attr("stroke-opacity", "0.3"); // opacidad [0,1] del borde
}
}
window.onload = function () {
dibujar();
};
</script>
</head>
<body>
<h1>Ejemplo usando Raphaël</h1>
<div id="scatterplot"></div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment