下面使用的是literallycanvas绘图,然后获取绘图结果为base64内容

var lc = LC.init(
document.getElementById('canvas-output'),
{
imageURLPrefix: '../libs/literallycanvas-0.4.14/img',
keyboardShortcuts: false,
tools: [LC.tools.Pencil, LC.tools.Eraser, LC.tools.Line,LC.tools.Rectangle,LC.tools.Text,LC.tools.Polygon,],
imageSize: {width: , height: },
keyboardShortcuts:false,
primaryColor:'#ff1177'
}
);
lc.on('drawingChange', function() {
map3d.planeImage.src = lc.getImage().toDataURL();
});

下面是使用图片纹理创建一个平面

// 地图平面
var self=this;
this.planeImage.onload = function() {
self.planeTexture.needsUpdate = true;
};
this.planeTexture.image = this.planeImage;
this.planeTexture.wrapS = this.planeTexture.wrapT = THREE.MirroredRepeatWrapping; var planeGeometry = new THREE.PlaneGeometry(, , , );
var planeMaterialL = new THREE.MeshLambertMaterial({ color: 0xffffff, side: THREE.DoubleSide });
var planeMaterialB = new THREE.MeshBasicMaterial({
map: this.planeTexture,
transparent: true,
}); this.plane = new THREE.SceneUtils.createMultiMaterialObject(planeGeometry,[planeMaterialL,planeMaterialB]);//new THREE.Mesh(planeGeometry, planeMaterialL);
this.plane.position.set(, -0.01, );
this.plane.rotation.x = -0.5 * Math.PI;
this.scene.add(this.plane);

three.js使用base64 图片创建Texture纹理的更多相关文章

  1. 图片上传前 压缩,base64图片压缩 Exif.js处理ios拍照倒置等问题

    曾写过在前端把图片按比例压缩不失真上传服务器的前端和后台,可惜没有及时做总结保留代码,只记得js利用了base64位压缩和Exif.js进行图片处理,还有其中让我头疼的ios拍照上传后会倒置等诸多问题 ...

  2. JS将本地图片转化成base64码

    在图片上传的时候,有时候后台需要前台上传base64文件,这时候我们就需要将图片资源转化成base64,下面这段js代码就可实现此功能. 1.首先在html里定义一个input输入框: BASE64图 ...

  3. js获取base64格式图片预览上传并用php保存到本地服务器指定文件夹

    html: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...

  4. 利用cropper插件裁剪本地图片,然后将裁剪过后的base64图片上传至七牛云空间

    现在做的项目需要做一些图片处理,由于时间赶急,之前我便没有处理图片,直接将图片放在input[type=file]里面,以文件的形式提交给后台,这样做简直就是最低级的做法,之后各种问题便出来了,人物头 ...

  5. C#MVC和cropper.js实现剪裁图片ajax上传的弹出层

     首先使用cropper.js插件,能够将剪裁后的图片返回为base64编码,后台根据base64编码解析保存图片. jQuery.cropper: 是一款使用简单且功能强大的图片剪裁jquery插件 ...

  6. 基于vue + axios + lrz.js 微信端图片压缩上传

    业务场景 微信端项目是基于Vux + Axios构建的,关于图片上传的业务场景有以下几点需求: 1.单张图片上传(如个人头像,实名认证等业务) 2.多张图片上传(如某类工单记录) 3.上传图片时期望能 ...

  7. 用js实现base64编码器

    base-64作为常见的编码函数,在基本认证.摘要认证以及一些HTTP扩展中得到了大量应用.在前端领域,也常常把图片转换为base-64编码在网络中传输.本文将详细介绍base64的原理及用js实现b ...

  8. 完整说明使用SpringBoot+js实现滑动图片验证

    常见的网站验证方式有手机短信验证,图片字符验证,滑块验证,滑块图片验证.本文主要讲解的是滑块图片验证的实现流程.包括后台和前端的实现. 实现效果 使用的API java.awt.image.Buffe ...

  9. 原生js+css3实现图片自动切换,图片轮播

    运用CSS3transition及opacity属性 制作图片轮播动画 自己这两天根据用js来控制触发CSS3中transition属性,从而写出来的以CSS3动画为基础,js控制过程的图片轮播 运用 ...

随机推荐

  1. Anagram字符串处理(STL真方便啊。。)

    题意:给出一些字符串,认为各个字符个数相同的字符串就是相同的,不区分大小写,找出这些字符串中不与其他字符串相同的字符串并挨个输出 用char orgin[][]把每个字符串保存起来,然后对每个字符串都 ...

  2. Windows守护进程简单示例

    转载: https://blog.csdn.net/kikaylee/article/details/51395360 /* @描述:一个简单的Windows守护进程的例子(C++版本) @作者:ki ...

  3. Linux 驱动——Button8(输入子系统)

    输入子系统由驱动层.输入子系统核心.事件处理层三部分组成.一个输入事件,如鼠标移动.键盘按下等通过Driver->Inputcore->Event handler->userspac ...

  4. Linux运维工程师应具备哪些技能?

      对于我们这些刚入门的运维小白来说,极强的好奇心总会驱使我们去涉猎各种技术,弄到最后很可能该学的知识半懵半解,知识体系混乱,学习毫无章法.因此,我们学习 时要有一个明确的目标和知识体系(也是我学习的 ...

  5. 08_java基础知识——方法重载

    一.自变量顺序不同 package com.huawei.test.java04; /** * This is Description * * @author 王明飞 * @date 2018/08/ ...

  6. 关闭Azure虚拟机

    Press the Windows key, and then in the Start page, located at the bottom-left, click the Power butto ...

  7. collections&time&random模块

    一.collections模块 在内置数据类型(dict.list.set.tuple)的基础上,collections模块还提供了几个额外的数据类型:Counter.deque.defaultdic ...

  8. flask中注册验证码和分页

    注册验证码.核心思路,替换注册页面的img标签的src属性. 1.准备好文件夹:captcha2.导包 from utils.captcha.captcha import captcha3.验证码生成 ...

  9. 14JDBC

    一.JDBC简介 全名:java database connection java代码与数据库相连的工具,java>JDBC>(oracle  mysql sql server) 二.四大 ...

  10. VS Code引用 vue/cli

    npm i @vue/cli -g    引用cli脚手架 3.0版本 下载好后 找个空文件夹  vue create myvue 创建vue项目   myvue是自己项目名称 Your connec ...