• H5分享截图方案优化

    相比之下,利用canvas绘制的方法更适合SPA应用。那么我们需要解决的是html2canvas对应的几个问题:图片跨域,清晰度低,圆弧计算精度差,深层节点解析出错。图片跨域 通过new Image()的方式生成图片,在image.onload...
    文章 2020-07-21 1246浏览量
  • artwlfeedback.js——仿google搜索结果页的“发送反馈...

    JS代码如下(canvas画图的代码有参考 Javascript实现canvas画图功能 一文): var artwlfeedback=(function(){ var load=function(callback){ html2canvas(document.body,{ onrendered:function(canvas){ canvas.id=...
    文章 2017-11-24 976浏览量
  • 超强1000个jquery极品插件!(连载中。...

    用法简单,只需要在你的元素的class上加上Jtip,并引入jtip.js及其样式即可以。jTip BetterTip 一个可以自定义Tooltip的jQuery插件。基于jTip,但比它来得更加灵活。BetterTip clueTip clueTip这个jQuery插件方便您为...
    文章 2017-11-14 1950浏览量
  • canvas技术概述

    此外,canvas绘制的内容 不属于任何DOM元素,在浏览器的元素查看器中也找不到,那自然无法检测鼠标点击了canvas中的哪个内容,很显然,这两方面,canvas都是不如SVG的。举个例子:如果使用CSS设置canvas元素的尺寸...
    文章 2020-04-01 515浏览量
  • JavaScript 编程精解 中文第三版 十七、在画布上绘图

    arc与其他绘制路径的方法一样,会自动连接到上一个路径上。你可以调用moveTo或者开启一个新的路径来避免这种情况。绘制饼状图 设想你刚刚从 EconomiCorp 获得了一份工作,并且你的第一个任务是画出一个描述其用户...
    文章 2018-05-12 1561浏览量
  • Hummingbird:在Web上运行Flutter应用

    我们正在发掘使位图 canvas 更高效的方法。为了表达 Flutter 的不透明度,变换,偏移,剪辑矩形和其他图层,我们使用纯 HTML 元素。例如,不透明度层变为 元素,其上具有 opacity CSS 属性,变换图层变为带有 ...
    文章 2019-08-05 895浏览量
  • 分享Silverlight/WPF/Windows Phone/HTML5一周学习...

    HTML5实现JS凸显表单选中效果 b20120323 9 个用来加速 HTML5 应用的方法 巧克力棒 关于HTML 5几个重要安全问题 art html5全屏api cly84920 用html5标记一段文章模块 cly84920 html5表单 cly84920 小试html5表单...
    文章 2017-11-08 1366浏览量
  • 图片(旋转/缩放/翻转)变换效果(ccs3/滤镜/canvas)

    canvas是一个用来绘制图形的元素,它最强大的地方在于结合js绘制图形甚至制作动画和游戏。ps:这里推荐几个入门文章:Opera的HTML 5 canvas 和深入了解canvas标签系列。要知道浏览器是否支持canvas,可以创建一个...
    文章 2016-05-12 2842浏览量
  • 让自己也能使用Canvas

    有操纵路径和绘制路径(包含贝塞尔曲线)的方法。操作过程大致为4步,先创建路径起始点,再画出路径,然后闭合路径,最后填充。1.简单图形 下图中是些简单的图形,两个三角形中有一个是旋转了画布的,逆时针画的半圆...
    文章 2017-11-08 1538浏览量
  • 深度|跨平台Web Canvas渲染引擎架构的设计与思考

    1 Canvas2D Rendering Context基础能力从Canvas2D标准来看,引擎需要提供的原子能力如下:路径绘制,包括直线、矩形、贝塞尔曲线等等;路径填充、描边、裁剪、混合,样式与颜色设置等;图元变换(transform)操作;...
    文章 2021-04-02 490浏览量
  • HTML5+JavaScript动画基础》——2.5 用户交互

    本节书摘来自异步社区《HTML5+JavaScript动画基础》一书中的第2章,第2.5节,作者:【美】Billy Lamberta,Keith Peters著,更多章节内容可以访问云栖社区“异步社区”公众号查看 2.5 用户交互 用户交互可能是你选择...
    文章 2017-05-02 1873浏览量
  • 赠书:HTML5 Canvas 2d 编程必读的两本经典

    赠书:HTML5 Canvas 2d 编程必读的两本经典 这两年多一直在和HTML5 Canvas 打交道,也带领团队开发了世界首款基于HTML5 Canvas 的演示文档工具-AxeSlide(斧子演示,www.axeslide.com)。在这个领域也积累了一些 经验...
    文章 2017-12-11 1490浏览量
  • 40 个重要的 HTML5 面试题及答案

    HTML5使用Canvas绘制矩形的代码 var c=document.getElementById("mycanvas");var ctx=c.getContext("2d");ctx.rect(20,20,150,100);ctx.stroke();CSS(级联样式表cascading style sheets)中的选择器是什么?选择器...
    文章 2017-05-02 1599浏览量
  • 40 个重要的 HTML5 面试题及答案

    HTML5使用Canvas绘制矩形的代码 var c=document.getElementById("mycanvas");var ctx=c.getContext("2d");ctx.rect(20,20,150,100);ctx.stroke();CSS(级联样式表cascading style sheets)中的选择器是什么?选择器...
    文章 2017-05-02 10651浏览量
  • 数字空间-2.5D可视化技术在云组态的技术探索

    Css+JStransform:rotate-五面法:依次绘制模型5个面,分别为每个面填充颜色毕竟“这个世界是方块组成的——Minecraft”,最简单实现思路就是提前绘制好模型的五个面,通过transform:rotate()来调整各面角度,并将...
    文章 2021-04-12 502浏览量
  • 可能是前端同学必备的 2D 游戏化互动入门基础知识

    画布在html中,我们一般使用canvas标签来绘制图像,它本身没有绘制能力,使用getContext获取绘制上下文,调用上下文上面的方法进行绘制。常用的绘制上下文有Canvas API 和WebGL,一般CanvasAPI来绘制2D图像,WebGL可...
    文章 2021-08-09 58浏览量
  • HTML5游戏编程核心技术与实战》——2.7 案例:《你...

    因为,首先,canvas并没有提供画点的方法,当然,可以通过绘制一个极小的矩形实现,但这不是主要问题。主要问题在于,虽然我们移动鼠标是连续移动,但电脑没有足够高的灵敏度捕捉鼠标的移动轨迹。事实上,如果采用...
    文章 2017-05-02 2174浏览量
  • HTML5 中 40 个最重要的技术点

    HTML5使用Canvas绘制矩形的代码 1 2 3 4 var c=document.getElementById("mycanvas");var ctx=c.getContext("2d");ctx.rect(20,20,150,100);ctx.stroke();CSS(cascading style sheets级联样式表)中的选择器是...
    文章 2014-10-18 699浏览量
  • HTML5 实现小车动画效果(Canvas/CSS3/JQuery)

    HTML5正在变得越来越流行。在这个移动设备日益增长的时代,对来自Adobe的Flash插件的改造需求也正在快速增长。因为就在最近,Adobe宣布Flash将不再支持移动设备。这意味着,Adobe自身也认为对移动设备来讲HTML5是一...
    文章 2017-11-22 1346浏览量
  • HTML最新标准HTML5小结

    HTML5canvas 元素使用 JavaScript 在网页上绘制图像,拥有多种绘制路径、矩形、圆形、字符以及添加图像的方法。lt;canvas id="myCanvas"width="200"height="100"style="border:1px solid#c3c3c3;gt;Your ...
    文章 2017-11-22 1273浏览量
  • HTML最新标准HTML5小结

    HTML5canvas 元素使用 JavaScript 在网页上绘制图像,拥有多种绘制路径、矩形、圆形、字符以及添加图像的方法。lt;canvas id="myCanvas"width="200"height="100"style="border:1px solid#c3c3c3;gt;Your ...
    文章 2017-11-16 785浏览量
  • 分享Silverlight/Windows8/WPF/WP7/HTML5周学习导读(5...

    HTML5 精要剖析》-3.2.2 矩形描绘 kangting html5 canvas jianguo_liao19840726 html5 geolocaltion jianguo_liao19840726 html5 range jianguo_liao19840726 html5 autofocus jianguo_liao19840726 html5 input ...
    文章 2017-11-10 1452浏览量
  • 看看前端学习路线,你还有哪些没掌握?

    图像API、使用canvas绘制图像、坐标变换、绘制文字。游戏原理、制作2D游戏引擎、理解游戏循环、渲染引擎实现、使用引擎构建游戏实例、游戏常用算法。高级阶段(高端技术和高级框架) 16.Nodejs企业级应用 Node的特点...
    文章 2019-12-30 973浏览量
  • Three.js与webVR

    5/方法返回传感器在某一时刻的信息(object)。例如包括时间戳、位置(x,y,z)、线速度、线加速度、角速度、角加速度、方向信息。6 var pose=vrInput.getPose();7/orientation 方向 8 if(pose.orientation!null){ 9/...
    文章 2017-09-20 1125浏览量
  • HTML 5网页开发实例具体解释》文件夹

    2.2.2 使用Modernizr库提供的方法检測浏览器的各项指标 2.3 表单和文件 2.3.1 input元素的新增类型 2.3.2 input元素新增的公用属性 2.3.3 新增表单元素 2.3.4 表单新增的验证方法 2.3.5 File对象 2.3.6 ...
    文章 2017-10-19 765浏览量
  • 基于 HTML5 的 3D 工业互联网展示方案

    顶部 logo 是根据在 Label 标签上添加 icon 的方法实现的,并将这个 topLabel 添加进垂直列 vBoxLayout 中: let topLabel=new ht.ui.Label();标签组件 topLabel.setText('Demo-logo');设置文字内容 topLabel....
    文章 2018-06-20 2817浏览量
  • 基于 HTML5 WebGL 的 3D 仓储管理系统

    顶部 logo 是根据在 Label 标签上添加 icon 的方法实现的,并将这个 topLabel 添加进垂直列 vBoxLayout 中: let topLabel=new ht.ui.Label();标签组件 topLabel.setText('Demo-logo');设置文字内容 topLabel....
    文章 2017-11-30 1534浏览量
  • 《Windows 8 开发权威指南:HTML5 和JavaScript卷》...

    canvas拥有多种绘制路径、矩形、圆形、字符以及添加图像的方法。2.1.5 用于媒介播放的video和audio元素我们无需再依赖第三方插件区渲染音频。HTML5提供了 lt;audio autoplay="autoplay"controls="controls">lt;...
    文章 2017-05-02 2248浏览量
  • web前端学习:HTML5十个新特性

    简单且灵活的JS图表绘制工具库,基于Canvas实现。类似于的工具还有ECharts、FreeChart、FusionCharts. 官网:http://www.chartjs.org/ 基本使用方法: (五)SVG绘图 Scalable Vector Graphic,可缩放向量图 在H5...
    文章 2018-07-18 968浏览量
  • 《JavaScript高效图形编程(修订版)》——6.11 一个...

    我们使用画布的 measureText()方法来计算文本和圆角矩形的宽度。6.背景drawBackground 对象绘制一个渐变的蓝天和绿地。蓝天和绿地都被渐变为白色以给人一种三维的深度感。7.初始化initAndGo()函数执行各种设置工作...
    文章 2017-05-02 1531浏览量
1 2 >

云产品推荐

视频直播 大数据计算服务 MaxCompute 国内短信套餐包 ECS云服务器安全配置相关的云产品 开发者问答 阿里云建站 新零售智能客服 万网 小程序开发制作 视频内容分析 视频集锦 代理记账服务 阿里云AIoT 阿里云科技驱动中小企业数字化