Char.Js 学习使用

<script src="../js/Chart.js"></script>
<div class="aui-col-xs-6" style="border:none;"><canvas id="first" width="" height="" style="float:left;"></canvas></div>
<script>
var data = {
labels: ["January", "February", "March", "April", "May", "June", "July"],
datasets: [
{
fillColor: "rgba(220,220,220,0.5)",
strokeColor: "rgba(220,220,220,1)",
pointColor: "rgba(220,220,220,1)",
pointStrokeColor: "#fff",
data: [, , , , , , ]
},
{
fillColor: "rgba(151,187,205,0.5)",
strokeColor: "rgba(151,187,205,1)",
pointColor: "rgba(151,187,205,1)",
pointStrokeColor: "#fff",
data: [, , , , , , ]
}
]
} function myChart() {
// $('#a_canvas').css('width', $(window).width()-30);
//window.addEventListener("load", function () { var options = ['现金', '红包', '碳值', '碳宝', '钻石', '铢']; // 获取上下文
var context = document.getElementById("first").getContext("2d");
var context1 = document.getElementById("seccend").getContext("2d");
var sthreed3 = document.getElementById("sthreed").getContext("2d");
//context.font = "20px Arial";
new Chart(context).Line(data, options);
}
myChart(); </script>

this.Line = function(data,options){ chart.Line.defaults = {
//网格线显示在数据的上方
scaleOverlay: false,
//硬编码重写y轴网格线
scaleOverride: false,
//y轴刻度的个数
scaleSteps: null,
//y轴每个刻度的宽度
scaleStepWidth: null,
//y轴的起始值
scaleStartValue: null,
//x轴和y轴的颜色
scaleLineColor: "rgba(0,0,0,0.1)",
//x轴和y轴的线的宽度
scaleLineWidth: ,
//是否显示y轴的标签
scaleShowLabels: true,
//标签显示值
scaleLabel: "<%=value%>",
//x轴和y轴标签的字体
scaleFontFamily: "'Arial'",
//标签字体的大小
scaleFontSize: ,
//标签字体的样式
scaleFontStyle: "normal",
//标签字体的颜色
scaleFontColor: "#666",
//是否显示网格线
scaleShowGridLines: true,
//网格线的颜色
scaleGridLineColor: "rgba(0,0,0,.08)",
//网格线的线宽
scaleGridLineWidth: ,
//是否是曲线
bezierCurve: true,
//是否显示点
pointDot: true,
//点的大小
pointDotRadius: ,
//点的边框的大小
pointDotStrokeWidth: ,
//是否显示数据集的笔画
datasetStroke: false,
//数据线的线宽度
datasetStrokeWidth: ,
//图标上的阴影部分
datasetFill: true,
//是否使用动画效果
animation: true,
//动画的步骤数(帧)
animationSteps: ,
//动画效果
animationEasing: "easeOutQuart",
//动画完成时的回调
onAnimationComplete: null
};