为什么不'；这两个javascript文件不是同时运行吗？为什么它们冲突/覆盖？

为什么会这样？假设左侧是白板，右侧画布包含条形图？基本上，javascript代码的前半部分不会执行。 我对调试知之甚少。但我认为“window.onload”可能是一个问题。我想让画布同时发挥功能，显示条形图和草图功能

var mycanvas，mycontext；
var SnapCanvas，mycontext；
var bchart，mycontext；
var绘图=错误；
功能findPos（obj）{
var curleft=curtop=0；
if（对象抵销父对象）{
做{
curleft+=obj.offsetLeft；
curtop+=对象偏移量；
}而（对象=对象抵销母公司）；
返回[curleft，curtop]；
}
}
函数getMouseCoords（事件）{
如果（！event）var event=window.event；
var-posx=0；
var-posy=0；
if（event.pageX | | event.pageY）{
posx=event.pageX；
posy=event.pageY；
}else if（event.clientX | | event.clientY）{
posx=event.clientX+document.body.scrollLeft+document.documentElement.scrollLeft；
posy=event.clientY+document.body.scrollTop+document.documentElement.scrollTop；
}
var totaloffset=findPos（mycanvas）；
var totalXoffset=totaloffset[0]；
var totalYoffset=totaloffset[1]；
var canvasX=posx-totalXoffset；
var canvasY=posy-总偏移量；
//返回数组中的坐标
返回[游说，游说]；
}
功能图（e）{
if（图纸）{
var coords=getMouseCoords（e）；
mycontext.lineTo（coords[0]，coords[1]）；
mycontext.stroke（）；
如果（如换档键）{
mycontext.fill（）；
}
}
}
函数startdraw（e）{
绘图=真；
mycontext.beginPath（）；
coords=getMouseCoords（e）；
mycontext.moveTo（coords[0]，coords[1]）；
}
函数stopdraw（）{
mycontext.closePath（）；
图纸=假；
}
函数重置（）{
mycontext.clearRect（0,0，mycanvas.clientWidth，mycanvas.clientHeight）；
mycontext.strokeStyle=“黑色”；
var myImage=新图像（）；
myImage.onload=函数（）{
mycontext.drawImage（myImage，0,03333500）；
mycontext.save（）；
}
myImage.src=mona；
}
函数下载面板（）{
document.getElementById（'downloadpic'）.src=mycanvas.toDataURL（）；
document.getElementById（'link'）。href=mycanvas.toDataURL（）；
document.getElementById（'panel'）.style.display=“block”；
}
函数closeDownloadPanel（）{
document.getElementById（'panel'）.style.display=“无”；
}
函数init（）{
mycanvas=document.getElementById（“bchart”）；
if（mycanvas.getContext）{
mycontext=mycanvas.getContext（“2d”）；
mycanvas.onmousemove=draw；
mycanvas.onmousedown=startdraw；
mycanvas.onmouseup=stopdraw；
mycanvas.onmouseout=stopdraw；
document.getElementById（“厚度”）.onchange=function（）{
设置厚度（该值）；
};
document.getElementById（“PenColor”）.onchange=function（）{
设置颜色（该值）；
};
document.getElementById（“FillColor”）.onchange=function（）{
设置填充颜色（该值）；
};
document.getElementById（“下载”）.onclick=downloadPanel；
document.getElementById（“清除”）.onclick=reset；
document.getElementById（“closepanel”）.onclick=function（）{
关闭下载面板（）；
返回false；
};
重置（）；
}
}
函数集厚度（x）{
mycontext.lineWidth=x；
}
函数集颜色（名称）{
mycontext.strokeStyle=名称；
}
函数setFillColor（名称）{
mycontext.fillStyle=名称；
}
window.onload=init；
//第二部分
window.onload=函数（）{
//图表样本数据
变量颜色={
周一：“红色”，
星期二：“蓝色”，
星期三：“黄色”，
星期四：“绿色”，
星期五：“橙色”，
Sat：“黑色”，
太阳：“棕色”
};
var=newarray（）；
[0]=“周一，87”；
[1]=“星期二，23”；
[2]=“星期三，60”；
[3]=“70号星期四”；
[4]=“周五，20”；
[5]=“Sat，90”；
[6]=“太阳，60”；
var帆布；
var语境；
//图表属性
var cWidth，cHeight，cMargin，cSpace；
var cMarginSpace，cMarginHeight；
//棒材特性
var bWidth、bMargin、totalBars、maxDataValue；
var bWidthMargin；
//条形动画
var ctr、numctr、速度；
//轴特性
var-totlabelsonaxis；
//条形图构造器
函数条形图（）{
canvas=document.getElementById（'SnapCanvas'）；
if（canvas&&canvas.getContext）{
context=canvas.getContext（'2d'）；
}
图表设置（）；
drawAxisLabelMarkers（）；
drawChartWithAnimation（）；
}
//初始化图表和条形图值
函数图表设置（）{
//图表属性
cMargin=15；
cSpace=20；
cHeight=canvas.height-2*cMargin-cSpace；
cWidth=canvas.width-2*cMargin-cSpace；
cMarginSpace=cMargin+cSpace；
cMarginHeight=cMargin+cHeight；
//棒材特性
b精氨酸=15；
totalBars=arr.length；
bWidth=（cWidth/totalBars）-bMargin；
//找到要在图表上绘制的最大值
maxDataValue=0；
对于（变量i=0；iparseInt（maxDataValue））
maxDataValue=barVal；
}
totLabelsOnYAxis=10；
context.font=“10pt Garamond”；
//初始化动画变量
ctr=0；
numctr=100；
速度=10；
}
//绘制图表轴、标签和标记
函数drawAxisLabelMarkers（）{
context.lineWidth=“2.0”；
//画y轴
drawAxis（cMarginSpace、cMarginHeight、cMarginSpace、cMargin）；
//画x轴
绘图轴（cMarginSpace、cMarginHeight、cMarginSpace+cWidth、cMarginHeight）；
context.lineWidth=“1.0”；
绘图标记（）；
window.addEventListener('load', function() {
  //first function here
}, false);
window.addEventListener('load', function() {
  //2nd function here
}, false);