Форум

l-liava-l · #1 (**permalink**) 23.05.2012, 16:11

Доброго времени суток!
что то не получается подключить libcanvas

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8" />

  <script src="lib/libcanvas-full-compiled.js"></script>
<script>//украл скрипт с сайта для проверки.
LibCanvas.extract();
atom.dom(function() {
 var canvas  = atom.dom('canvas').first;
 var context = canvas.getContext('2d-libcanvas');

 context
  .fillAll( '#efebe7' )
  .fill( new Rectangle( 75, 75, 30, 30 ), 'green' )
  .fill( new Circle   ( 50, 50, 20 )    , '#c00'  );
});</script>
</head>
 <body>
  <canvas></canvas>
 </body>
</html>

Пробовал по всякому, знаю же что ничего сложного нет в этом.
а не получается.
Вообщем кто умеет помогите пожалуста

vadim5june · #2 (**permalink**) 23.05.2012, 16:51

Не работал с этой библиотекой но могу предположить что надо скрипт в body вставить-потому что только после загрузки рисовать можно, кроме того возможно что

var canvas  = atom.dom('canvas').first;

передается id и нужно написать внизу

<canvas id='canvas' width=500 height=300></canvas>

DreamTheater · #3 (**permalink**) 23.05.2012, 16:52

Atom не подключен.

l-liava-l · #4 (**permalink**) 23.05.2012, 19:59

Цитата:

Не работал с этой библиотекой но могу предположить что надо скрипт в body вставить-потому что только после загрузки рисовать можно, кроме того возможно что

вставлял в тело, не помогло

Цитата:

Atom не подключен.

Насколько я понял я все криво подключаю.
Скачал либканвас https://github.com/theshock/libcanvas/downloads
но атома там небыло его докачал отсюда https://github.com/theshock/atomjs/downloads
Качал зипы, распоковал, указал в html-е путь к полным сборкам атома и либканвас. Никак.

vadim5june · #5 (**permalink**) 23.05.2012, 21:04

Вставляют в боди а id не надо было-простейший пример отсюда
http://libcanvas.github.com/

<html>
	<head>
		<meta charset="utf-8" />
		<title>LibCanvas :: Base animating</title>
		<link href="http://libcanvas.github.com/files/styles.css" rel="stylesheet" />
		<script src="http://libcanvas.github.com/files/js/atom.js"></script>
		<script src="http://libcanvas.github.com/files/js/libcanvas.js"></script>
	</head>
	<body>
		<canvas></canvas>
		
		<script>
new function () {
	var libcanvas = new LibCanvas('canvas').start();
                var shaper = libcanvas
		.createShaper({
			shape : new LibCanvas.Shapes.Circle(150, 75, 15),
			fill  : '#900',
			stroke: '#f00'
		});
               (function () {
		shaper.animate({
			props: {
				'shape.radius': 75,
				fill  : '#090',
				stroke: '#0f0'
			},
			time: 1000
		});
	}.delay(1000));
}
		</script>
</body>
</html>

l-liava-l · #6 (**permalink**) 23.05.2012, 21:14

да точно получилось) благодарю!

Форум

Справочник

Discord чат

Курсы javascript