欢迎光临 - 我的站长站,本站所有资源仅供学习与参考,禁止用于商业用途或从事违法行为!

html模板

在线图片转SVG格式工具源码
2023-10-16 我的站长站

在线图片转SVG格式工具源码

  • 模板编号:2844
  • 模板分类:html模板
  • 点击次数:52
  • 模板终端:电脑端
  • 适用版本:静态模板
  • 模板编码:UTF-8
  • 下载权限:普通 / VIP
  • 模板售价:免费下载
  • 下载次数:2
立即下载

源码介绍

非常简单一款在线图片转SVG格式工具源码,js+html的,无需环境打开即可使用。不想下载可以复制下面代码,保存到HTML文件即可使用。小白不会的就下载源码,已经打包好了。

在线图片转SVG格式工具源码
源码截图

代码分享 

提交表单代码:

<input id="upload" type="file" required accept="image/gif, image/jpeg, image/png">    
<img class="avatar" src="" alt="Avatar Preview">    
<a class="download-button" href="#" download="noavatar.svg">下载 SVG</a>

  JS处理代码:

document.getElementById('upload').addEventListener('change', function() {    
var file = this.files[0];    
if (file) {    
var reader = new FileReader();    
reader.readAsDataURL(file);    
reader.addEventListener('load', function() {    
var dataURL = this.result;    
var svgCode = '<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="120" height="120"><image xlink:href="'+dataURL+'" height="120" width="120"/></svg>';    
var blob = new Blob([svgCode], {type: 'image/svg+xml'});    
var url = URL.createObjectURL(blob);    
document.querySelector('.avatar').src = url;    
document.querySelector('.download-button').style.display = 'inline-block';    
document.querySelector('.download-button').href = url;    
});    
}    
});


下载地址

· 积分下载:下载扣除对应积分,不扣除下载次数
· VIP免费:VIP会员免费下载,扣除下载次数
· 下载即代表您已阅读并同意 [服务条款]

相关推荐
  • HTML源码
  • 站长工具源码
  • SVG
  • 在线多张图片拼图工具HTML源码
    在线多张图片拼图工具HTML源码

    源码介绍在线多张图片拼图工具HTML源码,在线将多张图片拼接成一张图片,多图合一并导出下载。下载时,使用日期时间作为文件名,规避图片文件名相同造成的覆盖问题;源码截图...

    html模板 44 2年前
  • 在线图片转SVG格式工具源码
    在线图片转SVG格式工具源码

    源码介绍非常简单一款在线图片转SVG格式工具源码,js+html的,无需环境打开即可使用。不想下载可以复制下面代码,保存到HTML文件即可使用。小白不会的就下载源码,已经打包好了。源码截图代码分享 提交...

    html模板 52 1年前
  • 小学加减乘除算术题混合出题工具HTML源码
    小学加减乘除算术题混合出题工具HTML源码

    源码介绍最新版本的小学加减乘除算术题混合出题工具HTML源码,新版本更新优化了很多功能,有了这款源码,再也不用为小学生出口算题目作业而烦恼了,无需软件、无需小程序,打开源码即可自动生成,支持打印。...

    html模板 17 1年前
  • UV运动助手HTML源码,小米在线刷步数
    UV运动助手HTML源码,小米在线刷步数

    源码介绍UV运动助手HTML源码,一款HTML+API接口的小米手机在线刷步数网站源码。源码截图源码使用方法1.从应用商店下载小米运动,打开软件通过手机号注册登录2.登录之后,点击我的->第三方接入->绑定...

    html模板 1068 2年前
  • 面试鸭模拟面试刷题考试网站源码,React+Node.js+云开发
    面试鸭模拟面试刷题考试网站源码,React+Node.js+云开发

    源码介绍一款面试鸭模拟面试刷题考试网站源码,基于React+Node.js+云开发,网站前台 + 后台的完整源代码。海量题目,自由组卷、在线刷题,全民编辑,多端适配。源码截图...

    html模板 1129 2年前
  • 在线图片转SVG格式工具源码
    在线图片转SVG格式工具源码

    源码介绍非常简单一款在线图片转SVG格式工具源码,js+html的,无需环境打开即可使用。不想下载可以复制下面代码,保存到HTML文件即可使用。小白不会的就下载源码,已经打包好了。源码截图代码分享 提交...

    html模板 52 1年前
  • 网站seo综合查询站长工具PHP源码
    网站seo综合查询站长工具PHP源码

    源码说明网站seo综合查询站长工具PHP源码,提供网站收录查询和站长查询以及百度权重值查询等多个站长工具。免费查询各种数据,包括收录量、反链、域名Whois查询、ping查询、子域名查询、服务器IP查...

    php源码 98 3年前
  • PHP多功能站长工具箱网站源码
    PHP多功能站长工具箱网站源码

    本源码需要PHP加MYSQL搭建,上传源码至空间目录,打开网页填入数据库账号密码即可安装成功。工具箱网站源码已经支持二维码生成,dns解析查询,短网址生成,icp备案查询,ip定位,全民k歌解析,在线ping,端...

    php源码 579 5年前
  • php白帆站长工具箱源码V.2.0
    php白帆站长工具箱源码V.2.0

    源码介绍php白帆站长工具箱源码V.2.0,带后台管理,支持用户自行上传和在线更新功能。支持后台修改工具首页内容,用户无需在服务器/ftp中修改。前段两套模板支持以及后台bt响应式的后台框架。站长工具...

    php源码 217 4年前
  • 思源的后花园站长工具箱EMLOG模板
    思源的后花园站长工具箱EMLOG模板

    模板介绍思源的后花园站长工具箱EMLOG模板,EMLOG二次开发,增加了后台上传API工具,以及文章调用API。规定了API制作规则,内置多款工具,作为例子学习制作。修改了emlog文章控制器的规则。后台发布选择模...

    emlog模板 109 3年前
  • 在线图片转SVG格式工具源码
    在线图片转SVG格式工具源码

    源码介绍非常简单一款在线图片转SVG格式工具源码,js+html的,无需环境打开即可使用。不想下载可以复制下面代码,保存到HTML文件即可使用。小白不会的就下载源码,已经打包好了。源码截图代码分享 提交...

    html模板 52 1年前
  • SVGcode在线免费图片转SVG矢量图工具
    SVGcode在线免费图片转SVG矢量图工具

    工具介绍SVGcode在线图片转换为SVG工具源码是一个Progressive Web App,可用于将JPG、PNG、GIF、WebP、AVIF等光栅图像转换为SVG格式的矢量图形。它使用文件系统访问API、异步剪贴板API、文件处理A...

    在线工具 151 2年前
  • 如何让WordPress支持上传SVG格式图片

    网上有很多以上类似的代码,但都不支持媒体库网格模式显示SVG图片,下面的代码可以实现让WordPress支持上传SVG格式图片:// 媒体库网格模式显示SVG图片function zm_display_svg_media($response, $attachment, $meta){if($response[&#39;type&#39;] === &...

    wordpress教程 79 3年前
  • svg科技感404网页模板
    svg科技感404网页模板

    一款动态方块效果的404网页模板,左边的方块是svg编写,可以上下移动,非常有科技感。div+css+svg编写,方块是svg代码,其他的都是CSS编写,在css/style.css里面都可以修改。...

    html模板 345 4年前
  • SVG+JavaScript华为太空人表网页模板
    SVG+JavaScript华为太空人表网页模板

    SVG+JavaScript华为太空人表网页模板,基于SVG+JavaScript开发。华为太空人表模板截图

    html模板 66 3年前