Share your knowledge
One Minute Guide

Working with ichartjs is purposefully easy, You need to include the following files in your web page.yes,that's all.

<script type="text/javascript" src="ichart.1.2.min.js"></script>


This is a simple example,show a Hello world in my way.the height of each letter is the position itself in,show it.


Let's see the impression drawing we do,hoping to attract you.following image show the final chart.

hello world

4.JavaScript code
	//define data
	var data = [
		{name : 'H',value : 7,color:'#a5c2d5'},
	   	{name : 'E',value : 5,color:'#cbab4f'},
	   	{name : 'L',value : 12,color:'#76a871'},
	   	{name : 'L',value : 12,color:'#76a871'},
	   	{name : 'O',value : 15,color:'#a56f8f'},
	   	{name : 'W',value : 13,color:'#c12c44'},
	   	{name : 'O',value : 15,color:'#a56f8f'},
	   	{name : 'R',value : 18,color:'#9f7961'},
	   	{name : 'L',value : 12,color:'#76a871'},
	   	{name : 'D',value : 4,color:'#6f83a5'}
		var chart = new iChart.Column2D({
			render : 'canvasDiv',//render to a div that id is 'canvasDiv'
			data: data,//binding data
			title : 'Hello World\'s Height In Alphabet',//setting title
			width : 800,//setting width in pixels
			height : 400,//setting width in pixels
			coordinate:{//setting customize coordinate
				scale:[{//setting customize value axis
					 start_scale:0,//setting start scale is 0
					 end_scale:26,//setting end scale is 26
					 scale_space:2,//setting space of scale
					 listeners:{//setting event
						parseText:function(t,x,y){//parse text on axis
							return {text:t+" cm"}
	<div id='canvasDiv'></div>

As a primary guide document,it just show how to working with ichartjs,For more options you can reference the Api.

6.Related resource

1).Hello World-src

2).ichartjs1.0 User Guide Simplified Chinese

3).Design Online