echart和d3.js

文档

http://echarts.baidu.com/option.html#title

参数name，data，type，symbolSize，tooltip，label，itemStyle

————————————————————————————————————————————————

给table中的每个td显示柱状图

    $(document).ready(function(){
        $(".ssc-table-2 tbody tr:nth-child(1)").find("td").each(function () {
            var num=$(this).context.cellIndex;
            var numtext=$(this).text();
            num=num+1;
            if(num!=1){
               console.log(num,numtext);
               var width = 19;    //画布的宽度
               var height = 19;   //画布的高度
               var dataset = [ numtext];
               d3.select(".ssc-table-2 tbody tr:nth-child(1) td:nth-child("+num+")")             //选择文档中的body元素
                   .append("svgParent")
                   .append("svg")              //添加一个svg元素
                   .attr("width", width)       //设定宽度
                   .attr("height", height)
                   .selectAll("rect")
                   .data(dataset)
                   .enter()
                   .append("rect")
                   .attr("width",width)
                   .attr("height",numtext)
                   .attr("x",0)
                   .attr("y",height-numtext)
                   .attr("fill","steelblue");//填充颜色
           }
            if(numtext>9){
               console.log('>9de',num,numtext);
               $(this).children("svgparent").css('margin-left','-17px');
           }
        });
    });