首页 > 其他分享 >html canvas写字并右对齐

html canvas写字并右对齐

时间:2023-06-15 16:46:55浏览次数:42  
标签:canvas color text toLeft ctx html 对齐 size

function PaintText(x, y, color, size, text, toLeft) {

if (toLeft == undefined) {
toLeft = true;
}

y += size;
ctx.font = "normal " + size+"px arial";
ctx.fillStyle = color;
if (toLeft) {
ctx.fillText(text, x, y);
}
else {

//使用ctx.measureText计算文本宽度,右对齐
ctx.fillText(text, ActualWidth-ctx.measureText(text).width, y);

}
}

标签:canvas,color,text,toLeft,ctx,html,对齐,size
From: https://www.cnblogs.com/QJZY/p/17483305.html

相关文章

  • HTML5 WebUploader 分片上传
    ​ 一、基本介绍 1,什么是WebUploader?WebUploader是由百度公司团队开发的一个以HTML5为主,FLASH为辅的现代文件上传组件。官网地址:http://fex.baidu.com/webuploader/JS-文件上传组件WebUploader使用详解2(MD5秒传、判断是否已经上传过)2,功能特点分片、并发:WebUplo......
  • 分栏对齐的操作。
    1,https://www.bilibili.com/video/BV13Y411T7tV/?spm_id_from=333.337.search-card.all.click&vd_source=07329bda28e0c1e2f09e196df68b7acf2我分栏就是不齐。直接找到合适的位置,设置一个分节符,这样就直接对齐了。......
  • HTML语法
    1.DOCTYPE以及lang描述:<!DOCTYPE>:是文档类型声明标签,告诉浏览器使用HTML5来渲染。lang:一般使用en或者zh-CN,告诉搜索引擎,采用什么语言展示。2.head标签2.1设置字符集样式:<metacharset="UTF-8">3.body标签3.1标题标签描述:h1-h6,一共六个级别样式:<h1></h1>注意......
  • HTML页面元素解释
    HTML代表超文本标记语言,是用于在万维网上创建网页和构建其内容的标准标记语言。HTML是Web开发的支柱,也是创建基于Web的文档的基本构建块。让我们快速看一下它是如何工作的。(更多优质内容:java567.com)HTML有什么作用?HTML的主要作用是通过使用一组标签或元素来定义网页的......
  • html 中拦截 js 的样式更改
    比如拦截html标签的font-size样式的更改:...<body><script>varobserver=newMutationObserver(function(mutations){mutations.forEach(function(mutation){if(mutation.type==='attributes'&&mutation.attribu......
  • 通过Canvas在浏览器中更酷的展示视频
    有了Canvas可以更灵活的展示体验更好的视频,能够与页面更好的融合。文/MatthewMcClure译/Johnhttps://mux.com/blog/canvas-adding-filters-and-more-to-video-using-just-a-browser/视频无疑是网页中最引人关注的元素之一。在一个兼容性良好的网页内,视频的动态画面让网页内容......
  • Canvas_绘制线段、圆形、文本、图像、视频、处理图像数据
    Canvas_绘制线段、圆形、文本、图像、视频、处理图像数据绘制线段varcanvas1=document.querySelector("#canvas1");varctx=canvas1.getContext("2d");//设置开始路径ctx.beginPath()//设置绘制的起始点ctx.moveTo(50,50);//设置经过某个位置ctx.lineTo(50,30......
  • css如何实现文字两端对齐效果
    想要实现文字两端对齐效果,可以使用CSS的text-align属性。设置text-align:justify;即可实现文字两端对齐效果。一、方法一给元素设置 text-align: justify;text-align-last:justify;并且加上text-justify:distribute-all-line;目的是兼容ie浏览器p{width:130px;text-al......
  • HTML
    hypertextmarkuplanguage超文本标记语言w3c是什么Web技术领域最具权威和影响力的国际中立性技术标准机构。w3c标准:结构化标准语言(HTML、XML)表现标准语言(CSS)行为标准(DOM、ECMAScript)HTML结构<!DOCTYPEhtml><htmllang="en"><head><!--meta标签是给搜索......
  • 如何将 pl/sql Developer 中查询的结果集导出到 Excel . txt . html . xml csv中?
    如何将pl/sqlDeveloper中查询的结果集导出到Excel.txt.html.xmlcsv中?https://blog.csdn.net/fish_boneold/article/details/83919116选中结果集,点击右键选 copytoexcel就可导出到一个临时的excel文件了,如temp001.xls,然后选择文件-另存为保存为我们的文......