想要在html5 canvas画布中打开一张本地图片,代码有什么问题
 <!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script type="text/javascript">
var canvas=document.getElementById("demo");
var cxt=canvas.getContext("2d");
//打开图片
function preImg(sourceId, targetId) {  
cxt.clearRect(0,0,400,400);
    if (typeof FileReader === 'undefined') {  
        alert('Your browser does not support FileReader...');  
        return;  
    }  
    var reader = new FileReader();  

    reader.onload = function(e) {  
        var img = document.getElementById(targetId); 
        var cxt=document.getElementById("demo").getContext("2d") 
        img.src = this.result;  
        img.onload=function()
   {
    cxt.drawImage(img,0,0);
   }
    }  
    reader.readAsDataURL(document.getElementById(sourceId).files[0]);  
}  
</script>
</head>

<body>

<form action="">  
    <input type="file" name="imgOne" id="imgOne" onchange="preImg(this.id,'imgPre');" />  
    <img id="imgPre" src="" style="display: block;" />    
</form> 
<canvas id="demo" width="400" height="400" style="border:1px solid red"></canvas> 
</body>
</html>

1个回答

调整循序,script放canvas后面,要不获取不到对象

   <form action="">
        <input type="file" name="imgOne" id="imgOne" onchange="preImg(this.id,'imgPre');" />
        <img id="imgPre" src="" style="display: block;" />
    </form>
    <canvas id="demo" width="400" height="400" style="border:1px solid red"></canvas>
    <script type="text/javascript">
        var canvas = document.getElementById("demo");
        var cxt = canvas.getContext("2d");
        //打开图片
        function preImg(sourceId, targetId) {
            cxt.clearRect(0, 0, 400, 400);
            if (typeof FileReader === 'undefined') {
                alert('Your browser does not support FileReader...');
                return;
            }
            var reader = new FileReader();

            reader.onload = function (e) {
                var img = document.getElementById(targetId);
                var cxt = document.getElementById("demo").getContext("2d")
                img.src = this.result;
                img.onload = function () {
                    cxt.drawImage(img, 0, 0);
                }
            }
            reader.readAsDataURL(document.getElementById(sourceId).files[0]);
        }
    </script>
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
html5 canvas画布,如何实现剪切功能?
用铅笔抑或是涂鸦的形式在画布上画上东西,想要剪切画布上的一部分,可以实现对剪切部分的拖动。网上关于canvas画布的资料不多,哪位能够帮帮忙呀。
把canvas画布上的图片保存到本地
不写后台,用js能不能实现用canvas编辑后的图片保存到本地
我使用画布把文字和图片合成一张新图 在分享出去 图片看起来非常模糊
公司一个项目需要把文字和图片 二维码各种合成一张新图 但是分享出去后图片看起来比较模糊求大佬指导![图片说明](https://img-ask.csdn.net/upload/202001/15/1579074867_663704.jpg /** * 分享时的图标 */ try { Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.mipmap.image_act_back); int width = 480;//画布大小 int height = 853;// // mBitmap =Bitmap.createBitmap(width,height, Bitmap.Config.ARGB_8888); mBitmap =BitmapUtil.getBitmap(bitmap,width,height); canvas = new Canvas(mBitmap); int x = 30; int y = 15; //合成淘宝 (判断是淘宝还是拼多多) Bitmap bitmap_tb = null; if (shopType.equals("1")){ //淘宝 bitmap_tb = BitmapFactory.decodeResource(getResources(), R.mipmap.qbs_tb); }else if (shopType.equals("3")){ bitmap_tb = BitmapFactory.decodeResource(getResources(), R.mipmap.qbs_pdd_order1); }else if (shopType.equals("4")){ bitmap_tb = BitmapFactory.decodeResource(getResources(), R.mipmap.qbs_wph); } Bitmap bitmap2 = BitmapUtil.fitBitmap(bitmap_tb,x); canvas.drawBitmap(bitmap2,x,y,mPicturePaint2); //商品标题 TextPaint1.setAntiAlias(true); TextPaint1.setTextSize(18); TextPaint1.setColor(getResources().getColor(R.color.black)); String content1 = shopTitle.length()>22? shopTitle.substring(0,22):shopTitle; int top2 = 30; canvas.drawText(content1,x+40,x,TextPaint1); //第二行标题 String content2; if (shopTitle.length()>34){ content2 = shopTitle.substring(22,35)+"...."; }else { content2 = shopTitle.length()>22? shopTitle.substring(23):shopTitle; } TextPaint1.setAntiAlias(true); TextPaint1.setTextSize(18); TextPaint1.setColor(getResources().getColor(R.color.black)); top2 = top2+30; canvas.drawText(content2,x,top2,TextPaint1); //券后价格 String content6 = "券后价:"; TextPaint1.setAntiAlias(true); TextPaint1.setTextSize(24); TextPaint1.setColor(getResources().getColor(R.color.detail_prise)); top2 = top2+40; canvas.drawText(content6,x,top2,TextPaint1); //券后价金额 TextPaint1.setAntiAlias(true); TextPaint1.setTextSize(30); TextPaint1.setColor(getResources().getColor(R.color.detail_prise)); String content8 = "¥"+price_after_coupons; canvas.drawText(content8,x+80,top2,TextPaint1); // //券背景 // Bitmap bitmap_q = BitmapFactory.decodeResource(getResources(), R.mipmap.qbs_q_back); // Bitmap bitmap_back = BitmapUtil.fitBitmap(bitmap_q,110); // canvas.drawBitmap(bitmap_back,330,top2-15,mPicturePaint2); if (!price_coupons.equals("")){ //券金额 TextPaint1.setAntiAlias(true); TextPaint1.setTextSize(16); TextPaint1.setColor(getResources().getColor(R.color.detail_prise));//detail_prise String content4 = "券¥"; canvas.drawText(content4,340,top2,TextPaint1); TextPaint1.setAntiAlias(true); TextPaint1.setTextSize(22); TextPaint1.setColor(getResources().getColor(R.color.detail_prise)); String content5 = price_coupons+""; canvas.drawText(content5,340+30,top2,TextPaint1); } //原价 TextPaint1.setAntiAlias(true); TextPaint1.setTextSize(16); TextPaint1.setColor(getResources().getColor(R.color.theme_black2)); CharSequence content3 = "原价¥"; top2 = top2+40; canvas.drawText(content3,0,content3.length(),x,top2,TextPaint1); //原价金额 TextPaint1.setAntiAlias(true); TextPaint1.setTextSize(26); TextPaint1.setColor(getResources().getColor(R.color.theme_black2)); CharSequence content7 = price; canvas.drawText(content7,0,content7.length(),x+60,top2,TextPaint1); //商品图 // int logo = 0; // Logger.e(TAG,"图片宽"+resource.getWidth()+"图片高"+resource.getHeight()); Bitmap bitmap_shop = BitmapUtil.fitBitmap(resource,width-50); Logger.e(TAG,"图片宽"+bitmap_shop.getWidth()+"图片高"+bitmap_shop.getHeight()); top2 = top2+20; // canvas = new Canvas(mBitmap); // logo = top2; canvas.drawBitmap(bitmap_shop,x,top2,mPicturePaint2); //公司logo Bitmap bitmap_logo = BitmapFactory.decodeResource(getResources(), R.mipmap.ht_creat_logo);//qbs_creat_logo icon_yfg Bitmap bitmap_log = BitmapUtil.fitBitmap(bitmap_logo,150); canvas.drawBitmap(bitmap_log,150,width+top2,mPicturePaint2); //二维码合成 Bitmap Zxing = ZxingUtils.createQRCode(Wx_Url,300); int width1 = Zxing.getWidth(); int height1 = Zxing.getHeight(); Matrix matrix = new Matrix(); matrix.postScale(0.35f,0.35f); Bitmap bitmap1 = Bitmap.createBitmap(Zxing, 0, 0, width1, height1, matrix, true); Logger.e("二维码宽","二维码宽"+bitmap1.getWidth()); canvas.drawBitmap(bitmap1,353,width-20+top2,mPicturePaint1); canvas.save(); canvas.restore(); creat_pic.setImageBitmap(mBitmap); ``` ```
html5在canvas中插入图片
在canvas中显示图片非常简单。可以通过修正层为图片添加印章、拉伸图片或者修改图片等,并且图片通常会成为canvas上的焦点。用HTML5 Canvas API内置的几个简单命令可以轻松地为canvas添加图片内容。 不过,图片增加了canvas操作的复杂度:必须等到图片完全加载后才能对其进行操作。浏览器通常会在页面脚本执行的同时异步加载图片。如果试图在图片未完全加载之前就将其呈现到canvas上,那么canvas将不会显示任何图片。因此,开发人员要特别注意,在呈现之前,应确保图片已经加载完毕。
canvas渲染图片对页面加载速度会有提升吗
页面中有很多图片 直接引用< img src="./img/0.jpg"> 和drawImage()转换成canvas那种会快一些
【html】canvas在ios上导出图片,图片会放大一倍,怎么保持1:1
例:图片为400X400的,在ios上打开canvas程序,然后绘画在400X400的canvas画板上 然后导出下载图片,下载出来的图片是800X800的 这个愿意是因为ios的分辨率大,我查到了,但是我想要的是,让他下载出来保持和导入的一样是400Px的,这个如何处理呢?
写段代码 画布canvas图片绕中心转
求段代码,画布canvas图片绕中心转。 即抽奖箭头(是张图片),不用写背景,只需要这个箭头绕中心转就好。起点为12点钟,每格36度,转三圈后到第二格(1-2点钟的位置)停下就可以了。 在线等
canvas画布跨域问题 苹果端
canvas 画布将多张图片拼凑, 使用 toDataURL 时出现跨域报错, 加上 headImg.crossOrigin = ”*“之后 在安卓端可以正常显示, 但是在 chrome以及苹果端 还是有跨域报错 不能正常显示图片 求解决方案。
跪求精通html5 CANVAS大神
跪求精通html5 CANVAS大神,用CANVAS 画布上面画矩形图,圆形图,曲线图等等,在线等
WPF中Canvas画布怎么逐笔清除和清空画布?
WPF中Canvas画布怎么逐笔清除和清空画布? protected override void OnStrokeCollected(InkCanvasStrokeCollectedEventArgs e) { base.Strokes.Remove(e.Stroke); //使用此方法时,请删除之前添加到 InkCanvas 的原始笔划 CustomStroke item = new CustomStroke(e.Stroke.StylusPoints); base.Strokes.Add(item); InkCanvasStrokeCollectedEventArgs args = new InkCanvasStrokeCollectedEventArgs(item); base.OnStrokeCollected(args); } 输出Strokes中为空是为什么,在其他位置调用inkCanvas.Strokes.Clear();没有用。
vue中用html2canvas转换图片 图片不完整 或有偏移 有空白区域
``` html部分 <div style="height: 312px;overflow:hidden"> <div class="parter" id="parter" ref="parter"> <div class="qrcode" id="qrcode"></div> <p class="copywriting">{{changeText}}</p> </div> </div> ``` ``` js部分 html2canvas(document.getElementById('parter'), { width: 300, height: 300, backgroundColor: null, useCORS: true, // 允许图片跨域 taintTest: true, // 在渲染前测试图片 timeout: 500 // 加载延时 }).then(canvas => { canvas.toBlob((blob) => { saveAs(blob, '桌贴.png') }) }) ``` ![图片说明](https://img-ask.csdn.net/upload/201908/03/1564815559_206721.png) 导出的图片网上偏移
unity的game界面里有canvas的线框?如何隐藏掉?
unity的game界面里有canvas的线框?如何隐藏掉? 之前测试的时候,没有发现该问题,不知道这个问题是一直存在的,还是我的操作导致的。 如图,箭头指向的位置 ![图片说明](https://img-ask.csdn.net/upload/202001/17/1579271245_992100.png)
微信小程序将view/画布canvas生成图片
## 背景 最近在做一个图片编辑的小程序,就是在一张图片上,放一些小装饰(图片),通过监听手势和使用CSS的transform实现移动和缩放。 ## 问题 但是遇到一个问题,就是如何将图片加上面的小装饰作为一个整体的图片保存起来呢? 在网上搜索好久,看到有的思路是将view写入画布,但是并没有解决方法。如果将图片直接写入画布,那么有如何做到缩放和移动呢,求教各位大佬
HTML5的canvas画布碰撞检测
``` <!DOCTYPE html> <html> <head> <title>防止重叠</title> <meta charset="utf-8"/> <style> #canvas1{ background-color:black;} #div1{ float:left;} #div2{ width:350px; height:150px; background-color:#999999; margin-left:10px; padding-left:5px; padding-top:5px; float:left;} </style> </head> <body> <div id="div1"> <canvas id="canvas1" width="300px" height="200px"></canvas> </div> <div id="div2"> </div> <script> var oCan=document.getElementById('canvas1'); var cxt=oCan.getContext('2d'); var rects=new Array(4); var colors=new Array("#CBD2F1","#544FE8","#F0F0CC","#C9F2DA"); for(var i=0;i<rects.length;i++){ rects[i]=new oRect(i*90,0,2,colors[i]); } flashMap(); function flashMap(){ cxt.clearRect(0,0,300,200); for(var i=0;i<rects.length;i++){ drawerRect(rects[i]); } game(); } function oRect(x,y,direct,color){ this.x=x; this.y=y; this.direct=direct; this.color=color; this.cout=5; this.speed=2; this.iTouch=function() { switch(this.direct) { case 0: for(i=0;i<rects.length;i++) { var et=rects[i]; if(et!=this) { if(et.direct==0||et.direct==2) { if(this.x>et.x+20||this.x+20<et.x||this.y-this.speed>et.y+30||this.y+30<et.y) { return true; } } if(et.direct==3||et.direct==1) { if(this.x>et.x+30||this.x+20<et.x||this.y-this.speed>et.y+20||this.y+30<et.y) { return true; } } } } break; case 1: for(i=0;i<rects.length;i++) { var et=rects[i]; if(et!=this) { if(et.direct==0||et.direct==2) { if(this.x>et.x+20||this.x+30+this.speed<et.x||this.y>et.y+30||this.y+20<et.y) { return true; } } if(et.direct==3||et.direct==1) { if(this.x>et.x+30||this.x+30+this.speed<et.x||this.y>et.y+20||this.y+20<et.y) { return true; } } } } break; case 2: for(i=0;i<rects.length;i++) { var et=rects[i]; if(et!=this) { if(et.direct==0||et.direct==2) { if(this.x>et.x+20||this.x+20<et.x||this.y>et.y+30||this.y+30+this.speed<et.y) { return true; } } if(et.direct==3||et.direct==1) { if(this.x>et.x+30||this.x+20<et.x||this.y>et.y+20||this.y+30+this.speed<et.y) { return true; } } } } break; case 3: for(i=0;i<rects.length;i++) { var et=rects[i]; if(et!=this) { if(et.direct==0||et.direct==2) { if(this.x-this.speed>et.x+20||this.x+30<et.x||this.y>et.y+30||this.y+20<et.y) { return true; } } if(et.direct==3||et.direct==1) { if(this.x-this.speed>et.x+30||this.x+30<et.x||this.y>et.y+20||this.y+20<et.y) { return true; } } } } break; } } this.run=function() { switch(this.direct) { case 0://向上 if(this.y>0&&this.iTouch()) { this.y-=this.speed; } break; case 1://向右 if(this.x<280&&this.iTouch()) { this.x+=this.speed; } break; case 2://向下 if(this.y<180&&this.iTouch()) { this.y+=this.speed; } break; case 3://向左 if(this.x>0&&this.iTouch()) { this.x-=this.speed; } break; } if(this.cout<=0){ this.cout=Math.round(Math.random()*10); this.direct=Math.floor(Math.random()*3.9999999); } this.cout--; } } function game(){ var str="矩形坐标为:<br/>"; for(var i=0;i<rects.length;i++){ str=str+"矩形"+(i+1)+": x="+rects[i].x+"&nbsp;&nbsp;y="+rects[i].y+"&nbsp;&nbsp;direct="+rects[i].direct+"&nbsp;&nbsp;cout="+rects[i].cout+"<br/>"; } document.getElementById('div2').innerHTML=str; } function drawerRect(iRect){ cxt.fillStyle=iRect.color; switch(iRect.direct){ case 0: case 2: cxt.fillRect(iRect.x,iRect.y,20,30); cxt.fill(); break; case 1: case 3: cxt.fillRect(iRect.x,iRect.y,30,20); cxt.fill(); break; } } window.setInterval("flashMap()",100); for(var i=0;i<rects.length;i++){ window.setInterval("rects["+i+"].run()",100); } </script> </body> </html> ```
html5 canvas输入文字
请问canvas如何实现在画布上输入问题,即画出一个矩形框,可以在框中输入文字。效果图如下。![图片说明](https://img-ask.csdn.net/upload/201508/03/1438592810_949115.png)
如何使得canvas里的图片能够进行旋转,而不导致整个画布的旋转
自定义的布局中,在一个Canvas里绘画了很多图片。现在想使得画布里的 每个图片都进行旋转。我使用了下面的代码 ``` public static void drawPic(Canvas canvas) { mRotation += 10; if (mRotation > 360) { mRotation = mRotation % 360; } synchronized (lockObject) { for (int i = 0; i < particleList.size();i++) { Picture particle = pictureList.get(i); Paint paint=new Paint(); ...... paint.setAlpha(particle.getAlpha()); //rotate the bitmap canvas.save(); Matrix matrix = new Matrix(); matrix.postRotate(mRotation,particle .getPositionX() + particle.getParticleWidth()/2, particle.getPositionY() + particle.getParticleHeight()/2); canvas.drawBitmap(particle.getParticleImage(), matrix, paint); canvas.restore(); } } } ``` 但是上面的代码运行的结果是整个画布旋转,而不是画布里的图片旋转,这是为什么?求高手解答。
求助阿~ 点击按钮,如何响应canvas画布中的事件
点击外面的按钮,如何响应canvas中的元素事件 ![图片说明](https://img-ask.csdn.net/upload/201611/08/1478602580_366141.png)![图片说明](https://img-ask.csdn.net/upload/201611/08/1478602589_550747.png)
HTML5如何在现有的背景图片上进行画图?(canvas如何实现)
就是我已经实现了canvas画图功能,我现在想在一张已有的图片上进行画图,如何实现?
用canvas绘图小车上下坡
√小车上下坡,要使用canvas+js进行绘图,模拟平地,上坡,坡顶,下坡四个状态的动画 1.不能使用任何图片,要求所有画面都要canbvas绘画出来 2、要求有车身,轮胎,车头 5、包含平地,上坡,坡顶,下坡四个部分的状态 4、体现出车轮滚动 5、体现王启动时候加速、刹车停止前减速的过程
Java学习的正确打开方式
在博主认为,对于入门级学习java的最佳学习方法莫过于视频+博客+书籍+总结,前三者博主将淋漓尽致地挥毫于这篇博客文章中,至于总结在于个人,实际上越到后面你会发现学习的最好方式就是阅读参考官方文档其次就是国内的书籍,博客次之,这又是一个层次了,这里暂时不提后面再谈。博主将为各位入门java保驾护航,各位只管冲鸭!!!上天是公平的,只要不辜负时间,时间自然不会辜负你。 何谓学习?博主所理解的学习,它是一个过程,是一个不断累积、不断沉淀、不断总结、善于传达自己的个人见解以及乐于分享的过程。
程序员必须掌握的核心算法有哪些?
由于我之前一直强调数据结构以及算法学习的重要性,所以就有一些读者经常问我,数据结构与算法应该要学习到哪个程度呢?,说实话,这个问题我不知道要怎么回答你,主要取决于你想学习到哪些程度,不过针对这个问题,我稍微总结一下我学过的算法知识点,以及我觉得值得学习的算法。这些算法与数据结构的学习大多数是零散的,并没有一本把他们全部覆盖的书籍。下面是我觉得值得学习的一些算法以及数据结构,当然,我也会整理一些看过...
大学四年自学走来,这些私藏的实用工具/学习网站我贡献出来了
大学四年,看课本是不可能一直看课本的了,对于学习,特别是自学,善于搜索网上的一些资源来辅助,还是非常有必要的,下面我就把这几年私藏的各种资源,网站贡献出来给你们。主要有:电子书搜索、实用工具、在线视频学习网站、非视频学习网站、软件下载、面试/求职必备网站。 注意:文中提到的所有资源,文末我都给你整理好了,你们只管拿去,如果觉得不错,转发、分享就是最大的支持了。 一、电子书搜索 对于大部分程序员...
linux系列之常用运维命令整理笔录
本博客记录工作中需要的linux运维命令,大学时候开始接触linux,会一些基本操作,可是都没有整理起来,加上是做开发,不做运维,有些命令忘记了,所以现在整理成博客,当然vi,文件操作等就不介绍了,慢慢积累一些其它拓展的命令,博客不定时更新 free -m 其中:m表示兆,也可以用g,注意都要小写 Men:表示物理内存统计 total:表示物理内存总数(total=used+free) use...
比特币原理详解
一、什么是比特币 比特币是一种电子货币,是一种基于密码学的货币,在2008年11月1日由中本聪发表比特币白皮书,文中提出了一种去中心化的电子记账系统,我们平时的电子现金是银行来记账,因为银行的背后是国家信用。去中心化电子记账系统是参与者共同记账。比特币可以防止主权危机、信用风险。其好处不多做赘述,这一层面介绍的文章很多,本文主要从更深层的技术原理角度进行介绍。 二、问题引入 假设现有4个人...
程序员接私活怎样防止做完了不给钱?
首先跟大家说明一点,我们做 IT 类的外包开发,是非标品开发,所以很有可能在开发过程中会有这样那样的需求修改,而这种需求修改很容易造成扯皮,进而影响到费用支付,甚至出现做完了项目收不到钱的情况。 那么,怎么保证自己的薪酬安全呢? 我们在开工前,一定要做好一些证据方面的准备(也就是“讨薪”的理论依据),这其中最重要的就是需求文档和验收标准。一定要让需求方提供这两个文档资料作为开发的基础。之后开发...
网页实现一个简单的音乐播放器(大佬别看。(⊙﹏⊙))
今天闲着无事,就想写点东西。然后听了下歌,就打算写个播放器。 于是乎用h5 audio的加上js简单的播放器完工了。 演示地点演示 html代码如下` music 这个年纪 七月的风 音乐 ` 然后就是css`*{ margin: 0; padding: 0; text-decoration: none; list-...
Python十大装B语法
Python 是一种代表简单思想的语言,其语法相对简单,很容易上手。不过,如果就此小视 Python 语法的精妙和深邃,那就大错特错了。本文精心筛选了最能展现 Python 语法之精妙的十个知识点,并附上详细的实例代码。如能在实战中融会贯通、灵活使用,必将使代码更为精炼、高效,同时也会极大提升代码B格,使之看上去更老练,读起来更优雅。
数据库优化 - SQL优化
以实际SQL入手,带你一步一步走上SQL优化之路!
2019年11月中国大陆编程语言排行榜
2019年11月2日,我统计了某招聘网站,获得有效程序员招聘数据9万条。针对招聘信息,提取编程语言关键字,并统计如下: 编程语言比例 rank pl_ percentage 1 java 33.62% 2 cpp 16.42% 3 c_sharp 12.82% 4 javascript 12.31% 5 python 7.93% 6 go 7.25% 7 p...
通俗易懂地给女朋友讲:线程池的内部原理
餐盘在灯光的照耀下格外晶莹洁白,女朋友拿起红酒杯轻轻地抿了一小口,对我说:“经常听你说线程池,到底线程池到底是个什么原理?”
《奇巧淫技》系列-python!!每天早上八点自动发送天气预报邮件到QQ邮箱
将代码部署服务器,每日早上定时获取到天气数据,并发送到邮箱。 也可以说是一个小型人工智障。 知识可以运用在不同地方,不一定非是天气预报。
经典算法(5)杨辉三角
杨辉三角 是经典算法,这篇博客对它的算法思想进行了讲解,并有完整的代码实现。
英特尔不为人知的 B 面
从 PC 时代至今,众人只知在 CPU、GPU、XPU、制程、工艺等战场中,英特尔在与同行硬件芯片制造商们的竞争中杀出重围,且在不断的成长进化中,成为全球知名的半导体公司。殊不知,在「刚硬」的背后,英特尔「柔性」的软件早已经做到了全方位的支持与支撑,并持续发挥独特的生态价值,推动产业合作共赢。 而对于这一不知人知的 B 面,很多人将其称之为英特尔隐形的翅膀,虽低调,但是影响力却不容小觑。 那么,在...
腾讯算法面试题:64匹马8个跑道需要多少轮才能选出最快的四匹?
昨天,有网友私信我,说去阿里面试,彻底的被打击到了。问了为什么网上大量使用ThreadLocal的源码都会加上private static?他被难住了,因为他从来都没有考虑过这个问题。无独有偶,今天笔者又发现有网友吐槽了一道腾讯的面试题,我们一起来看看。 腾讯算法面试题:64匹马8个跑道需要多少轮才能选出最快的四匹? 在互联网职场论坛,一名程序员发帖求助到。二面腾讯,其中一个算法题:64匹...
面试官:你连RESTful都不知道我怎么敢要你?
干货,2019 RESTful最贱实践
刷了几千道算法题,这些我私藏的刷题网站都在这里了!
遥想当年,机缘巧合入了 ACM 的坑,周边巨擘林立,从此过上了"天天被虐似死狗"的生活… 然而我是谁,我可是死狗中的战斗鸡,智力不够那刷题来凑,开始了夜以继日哼哧哼哧刷题的日子,从此"读题与提交齐飞, AC 与 WA 一色 ",我惊喜的发现被题虐既刺激又有快感,那一刻我泪流满面。这么好的事儿作为一个正直的人绝不能自己独享,经过激烈的颅内斗争,我决定把我私藏的十几个 T 的,阿不,十几个刷题网...
为啥国人偏爱Mybatis,而老外喜欢Hibernate/JPA呢?
关于SQL和ORM的争论,永远都不会终止,我也一直在思考这个问题。昨天又跟群里的小伙伴进行了一番讨论,感触还是有一些,于是就有了今天这篇文。 声明:本文不会下关于Mybatis和JPA两个持久层框架哪个更好这样的结论。只是摆事实,讲道理,所以,请各位看官勿喷。 一、事件起因 关于Mybatis和JPA孰优孰劣的问题,争论已经很多年了。一直也没有结论,毕竟每个人的喜好和习惯是大不相同的。我也看...
白话阿里巴巴Java开发手册高级篇
不久前,阿里巴巴发布了《阿里巴巴Java开发手册》,总结了阿里巴巴内部实际项目开发过程中开发人员应该遵守的研发流程规范,这些流程规范在一定程度上能够保证最终的项目交付质量,通过在时间中总结模式,并推广给广大开发人员,来避免研发人员在实践中容易犯的错误,确保最终在大规模协作的项目中达成既定目标。 无独有偶,笔者去年在公司里负责升级和制定研发流程、设计模板、设计标准、代码标准等规范,并在实际工作中进行...
SQL-小白最佳入门sql查询一
不要偷偷的查询我的个人资料,即使你再喜欢我,也不要这样,真的不好;
项目中的if else太多了,该怎么重构?
介绍 最近跟着公司的大佬开发了一款IM系统,类似QQ和微信哈,就是聊天软件。我们有一部分业务逻辑是这样的 if (msgType = "文本") { // dosomething } else if(msgType = "图片") { // doshomething } else if(msgType = "视频") { // doshomething } else { // doshom...
Nginx 原理和架构
Nginx 是一个免费的,开源的,高性能的 HTTP 服务器和反向代理,以及 IMAP / POP3 代理服务器。Nginx 以其高性能,稳定性,丰富的功能,简单的配置和低资源消耗而闻名。 Nginx 的整体架构 Nginx 里有一个 master 进程和多个 worker 进程。master 进程并不处理网络请求,主要负责调度工作进程:加载配置、启动工作进程及非停升级。worker 进程负责处...
【图解经典算法题】如何用一行代码解决约瑟夫环问题
约瑟夫环问题算是很经典的题了,估计大家都听说过,然后我就在一次笔试中遇到了,下面我就用 3 种方法来详细讲解一下这道题,最后一种方法学了之后保证让你可以让你装逼。 问题描述:编号为 1-N 的 N 个士兵围坐在一起形成一个圆圈,从编号为 1 的士兵开始依次报数(1,2,3…这样依次报),数到 m 的 士兵会被杀死出列,之后的士兵再从 1 开始报数。直到最后剩下一士兵,求这个士兵的编号。 1、方...
吐血推荐珍藏的Visual Studio Code插件
作为一名Java工程师,由于工作需要,最近一个月一直在写NodeJS,这种经历可以说是一部辛酸史了。好在有神器Visual Studio Code陪伴,让我的这段经历没有更加困难。眼看这段经历要告一段落了,今天就来给大家分享一下我常用的一些VSC的插件。 VSC的插件安装方法很简单,只需要点击左侧最下方的插件栏选项,然后就可以搜索你想要的插件了。 下面我们进入正题 Material Theme ...
如何防止抄袭PCB电路板
目录 1、抄板是什么 2、抄板是否属于侵权 3、如何防止抄板 1、抄板是什么 抄板也叫克隆或仿制,是对设计出来的PCB板进行反向技术研究;目前全新的定义:从狭义上来说,抄板仅指对电子产品电路板PCB文件的提取还原和利用文件进行电路板克隆的过程;从广义上来说,抄板不仅包括对电路板文件提取、电路板克隆、电路板仿制等技术过程,而且包括对电路板文件进行修改(即改板)、对电子产品外形模具进行三维...
“狗屁不通文章生成器”登顶GitHub热榜,分分钟写出万字形式主义大作
一、垃圾文字生成器介绍 最近在浏览GitHub的时候,发现了这样一个骨骼清奇的雷人项目,而且热度还特别高。 项目中文名:狗屁不通文章生成器 项目英文名:BullshitGenerator 根据作者的介绍,他是偶尔需要一些中文文字用于GUI开发时测试文本渲染,因此开发了这个废话生成器。但由于生成的废话实在是太过富于哲理,所以最近已经被小伙伴们给玩坏了。 他的文风可能是这样的: 你发现,...
程序员:我终于知道post和get的区别
是一个老生常谈的话题,然而随着不断的学习,对于以前的认识有很多误区,所以还是需要不断地总结的,学而时习之,不亦说乎
《程序人生》系列-这个程序员只用了20行代码就拿了冠军
你知道的越多,你不知道的越多 点赞再看,养成习惯GitHub上已经开源https://github.com/JavaFamily,有一线大厂面试点脑图,欢迎Star和完善 前言 这一期不算《吊打面试官》系列的,所有没前言我直接开始。 絮叨 本来应该是没有这期的,看过我上期的小伙伴应该是知道的嘛,双十一比较忙嘛,要值班又要去帮忙拍摄年会的视频素材,还得搞个程序员一天的Vlog,还要写BU...
加快推动区块链技术和产业创新发展,2019可信区块链峰会在京召开
11月8日,由中国信息通信研究院、中国通信标准化协会、中国互联网协会、可信区块链推进计划联合主办,科技行者协办的2019可信区块链峰会将在北京悠唐皇冠假日酒店开幕。   区块链技术被认为是继蒸汽机、电力、互联网之后,下一代颠覆性的核心技术。如果说蒸汽机释放了人类的生产力,电力解决了人类基本的生活需求,互联网彻底改变了信息传递的方式,区块链作为构造信任的技术有重要的价值。   1...
Python 植物大战僵尸代码实现(2):植物卡片选择和种植
这篇文章要介绍的是: - 上方植物卡片栏的实现。 - 点击植物卡片,鼠标切换为植物图片。 - 鼠标移动时,判断当前在哪个方格中,并显示半透明的植物作为提示。
相关热词 c# 二进制截断字符串 c#实现窗体设计器 c#检测是否为微信 c# plc s1200 c#里氏转换原则 c# 主界面 c# do loop c#存为组套 模板 c# 停掉协程 c# rgb 读取图片
立即提问