這個僅僅是一個程式碼例子。

1.cocos creator的左下方資源管理器，點右鍵，彈出選單，建立一個Scene,預設名稱就可以。

2.同樣在再建立一個JavaScript，名稱為drawsix

3.然後在雙擊這個scene，進入這個場景的編輯。在cocos creator的左上角的層級管理器的Canvas點，右鍵選單建立一個空節點。

4.在左上角的層級管理器，選中這個節點，右邊會這個節點的屬性列表。然後為這個節點增加graphics和使用者指令碼元件。

注：這步很關鍵，沒有這個graphics元件，是畫不出來圖的。

這樣就完成元件設定，然後雙擊左下角的資源管理器中的drawsix這個js指令碼，啟動vscode進行編輯。輸入下面程式碼，儲存。

cc.Class({
    extends: cc.Component,

    properties: {
    },

    onLoad () {
        this.graphics = this.getComponent(cc.Graphics);
        this.graphics.lineWidth = 2;

		this.drawSixLine(200);
		this.drawSix(200);
	},
	//生成0.1-1之間的隨機數
	randNumber() {
		let r = Math.random();
		if(r < 0.1) r = 0.1;
		return r;
	},
	//畫六維圖，並填充
	drawSix(paramLength) {
		let graphics = this.graphics;
		graphics.strokeColor.fromHEX('#00ff00');
		graphics.strokeColor.a = 0;
		let first = {x:0,y:0};
		for(let i = 0; i < 6; i++) {
			let ang = i/3 * Math.PI;
			let length = paramLength * this.randNumber();
			let x = length * Math.cos(ang);
			let y = length * Math.sin(ang);
			if(i === 0) {
				first.x = x;
				first.y = y;
				graphics.moveTo(x,y);
			}
			graphics.lineTo(x,y);
		}
		graphics.lineTo(first.x, first.y);
		graphics.moveTo(0,0);
		graphics.fillColor.fromHEX('#00ff00');
		graphics.fillColor.a = 125;
		graphics.fill();
		graphics.stroke();
	},
	//畫六維線
	drawSixLine(paramLength) {
		let graphics = this.graphics;
        graphics.strokeColor.fromHEX('#ffffff');
		for(let i = 0; i < 6; i++) {
			let ang = i/3*Math.PI;
			let x = paramLength * Math.cos(ang);
			let y = paramLength * Math.sin(ang);
			graphics.moveTo(0,0);
			graphics.lineTo(x,y);
		}
		//畫圈
		let r = 200/3;
		for(let i = 1; i < 4; i++) {
			graphics.circle(0,0,i*r);
		}
		graphics.stroke();
	},

    start () {

    },

});
 

最在確認當前的scene是不是自己剛建立的Scene，然後在cocos creator點執行，就可以了。

最後是執行結果：