Dojo팀은 그들의 문서를 개선시키고 Dojo 개발자들에게 보다 많은 정보를 주려고 정말 열심히 노력하고 있습니다. DojoCampus.orgSitePen 블로그간에, Dojo 커뮤니티를 위한 알찬 교육자료를 제공하고 있습니다.

보통, Ajaxian 자습서는 정말 좋은 교육 자료를 하나만 다루지만 최근에는 두 개의 멋진 자습서도 다룬 적이 있어 Ajaxian 독자들에게 두 개를 제공하기로 했다고 합니다.

Tutorial 1: Dojo Drag and Drop, Part 1: dojo.dnd
이 시리즈의 첫번째 부분에서, Revin Guillen 씨가 dojo.dnd라고 불리는 Dojo의 드래그앤드롭 API로 여러분을 안내할 것입니다.

Revin씨의 자습서에서 진짜 마음에 드는 부분은 개념을 공고히 해주는 그의 값진 코드 예제들입니다. 예를 들어, 드롭 핸들러를 작성하는 그의 데모 코드는 매우 값지고 간결해서 읽는 이로 하여금 드롭 핸들러 작성방법을 쉽게 이해할 수 있게 합니다.
[code:js]
// calculate simple totals in the wishlist and cart titles
var setupCartTitle = function(){
    var title = "Shopping Cart";
    var cartLength = cart.getAllNodes().length;
    if(cartLength){
        var items = cartLength> 1 ? " items" : " item";
        title += " (" + cartLength + items + ")";
    }
    cartPane.setTitle(title);
};
var setupWishlistTitle = function(){
    var title = "Wishlist";
    var wishlistLength = wishlist.getAllNodes().length;
    if(wishlistLength){
        var items = wishlistLength> 1 ? " items" : " item";
        title += " (" + wishlistLength + items + ")";
    }
    wishlistPane.setTitle(title);
};
dojo.connect(cart, "onDndDrop", setupCartTitle);
dojo.connect(wishlist, "onDndDrop", setupWishlistTitle);

Tutorial 3: A Beginner’s Guide to Dojo Charting, Part 1 of 2

다음은 Doug McMaster씨가 Dojo 차트 기능 사용법을 알려드릴 것입니다.
이 두 개의 가이드에서,우리는 Dojo Charting을 얻고 실행하기가 얼마나 쉬운지 살펴보고, 여러분의 차트를 다른 모양으로 만드는 옵션들에 대해 매우 상세히 설명할 것입니다. 오늘은 Part 1에서, 간단한 예제로 시작하고 차트 모양을 정의하는 모든 옵션에 대해 알아보겠습니다. Part 2에서는 차트의 축과 데이터 셋을 정의하는 옵션에 대해 다루도록 하겠습니다.
Doug씨는 Dojo 차트 API에서 2D 차트를 커스터마이징해서 쉽게 차트를 생성하는 법을 설명하고 있습니다. 예제는 보시는 바와 같이 단순합니다:
[code:xml]
<html>
<head>
<title>Basic Charting</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 
<script type="text/javascript" src="dojo/dojo.js" djConfig="isDebug: true"></script>
 
<script type="text/javascript">
 
dojo.require("dojox.charting.Chart2D");
 
makeCharts = function(){
 
        var chart1 = new dojox.charting.Chart2D("simplechart");
        chart1.addPlot("default", {type: "Lines"});
        chart1.addAxis("x");
        chart1.addAxis("y", {vertical: true});
        chart1.addSeries("Series 1", [1, 2, 2, 3, 4, 5, 5, 7]);
        chart1.render();
 
};
 
dojo.addOnLoad(makeCharts);
 
</script>
</head>
<body>
<div id="simplechart" style="width: 250px; height: 150px;"></div>
</body>
</html>
결과는 이렇습니다:
사용자 삽입 이미지
from Ajaxian Featured Tutorial: A Double Dose of Dojo
Posted by 행복한고니 트랙백 0 : 댓글 0

댓글을 달아 주세요