Board Game
HTML
<script src="https://raw.github.com/DmitryBaranovskiy/raphael/master/raphael-min.js"></script>
<div id="canvas">
</div>
CSS
.canvas{
border:solid 2px red;
}
JavaScript
var Paper = new Raphael('canvas', 1000, 600);
var options = function(canvasDefaults) {
}
//The Road Tile Object
var roadPatch = function(options, Paper) {
var settings = {
'sidewalkWidth': 20,
'sidewalkLength': 100,
'sidewalkColor': 'brown',
'roadPatchWidth': 100,
'roadPatchLength': 100,
'roadPatchColor': 'black',
'roadStripLength': 40,
'roadStripWidth': 10,
'roadStripColor': '#FFFFFF',
};
function getSettings(){
return this .settings;
}
Paper.rect(i * 100, 0, settings.roadPatchLength, settings.roadPatchWidth).attr({
'fill': '#3D6E99',
'stroke': '#3D6E99'
});
Paper.rect(20 + (100 * i), 40, settings.roadStripLength, settings.roadStripWidth).attr({
'fill': 'white'
});
}
var k = [];
for (var i = 0; i < 10; i++) {
var a = new roadPatch({}, Paper);
alert(a.getSettings());
}
k.push(a);
}