Javascript/jQuery的插件SVGSketchPad怎么使用
作者：手机用户2502931303 | 来源：互联网 | 2023-06-03 19:00
本文小编为大家详细介绍“JavascriptjQuery的插件SVGSketchPad怎么使用”，内容详细，步骤清晰，细节处理妥当，希望这篇“JavascriptjQuery的插件SVG
本文小编为大家详细介绍“Javascript/jQuery的插件SVG SketchPad怎么使用”，内容详细，步骤清晰，细节处理妥当，希望这篇“Javascript/jQuery的插件SVG SketchPad怎么使用”文章能帮助大家解决疑惑，下面跟着小编的思路慢慢深入，一起来学习新知识吧。
使用代码
要使用代码，只需包含editor.js文件并初始化为常规 jQuery 插件。
下面的示例代码创建了(#content) 一个具有所需尺寸区域的简单 。然后在 jQuerydocument.ready函数中创建一个 jQuery 对象并附加 change 事件处理程序。在此处理程序中，它使用 Scribble 的对象toText 函数将绘图作为 svg 文本字符串，并将预览 #res 元素的值设置为该 svg。
此外，它还获取绘图的 PNG 值并将预览图像设置为该值。由于图像加载不是在浏览器中的即时操作，因此当图像准备好时，将调用作为函数参数提供的事件处理程序。
onchange 事件 - 每次更改图像时生成
toText(type, onLoad) 方法 - 一种将当前 SVG 值作为不同格式的字符串返回的方法。可能的格式：
○ svg - 返回值作为 SVG 字符串
○ base64 - SVG base64 编码的值
○ mix - 如果 SVG 包含 unicode 字符 (emojii)，则使用 base64 编码，否则返回非编码值
○ png、jpeg 或任何其他没有“imamge/”部分的图像 mime 类型。调用时，返回值是 base64 编码值。图像将在 OnLoad 方法中返回（此处需要）
支持的工具
兴趣点
Base64 编码
在某些时候对最终产品进行故障排除，我遇到了 emojii 无法正确重新加载的问题。我花了一段时间才意识到我的数据库列是 varchar(max) 并且不存储 unicode。由于其他项目使用相同的数据库，因此我决定将SVG编码为base 64，而不是更改列类型。不幸的是，浏览器中的btoa函数有问题，因此需要一些时间才能找到解决方案。
SVG 加载/兼容性
SVG 是一种完整的语言。我从来没有打算能够支持 SVG 规范中定义的所有功能，只是为了能够加载我之前创建的文档。请不要仅使用随机的 SVG 文档来尝试它 - 它很可能不起作用。
读到这里，这篇“Javascript/jQuery的插件SVG SketchPad怎么使用”文章已经介绍完毕，想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会，如果想了解更多相关内容的文章，欢迎关注编程笔记行业资讯频道。
京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有 