1. 程式人生 > >nodejs之SVG轉圖片下載方案

nodejs之SVG轉圖片下載方案

var phantom = require('phantom');
var fs = require('fs');
var express = require('express');
var app = express();

app.get('/download', function(req, res) {
    //建立phantom例項
    phantom.create(function(ph) {
        //建立page例項
        ph.createPage(function(page) {
            //載入頁面
            page.open("template.html", function(status) {
                //設定剪輯的矩形
                page.evaluate(function() {
                        var selector = "#Viewport";
                        return document.querySelector(selector).getBoundingClientRect();
                    },
                    function(result) {
                        //設定剪輯框
                        page.set("clipRect", result);
                        //生成png圖片
                        page.render('a.png', {
                            format: 'png',
                            quality: '100'
                        }, function() {
                            //下載圖片到客戶端
                            res.download('a.png', "test.png");
                        });
                    });
            });
        });
    });
});
//設定http監聽
var server = app.listen(3040, function() {
    var host = server.address().address;
    var port = server.address().port;
    console.log('Example app listening at http://%s:%s', host, port);
});
這段程式碼使用phantomjs的page.render將svg部分生成a.png圖片,再下載下來,其中圖片的名稱可以通過以下程式碼自定義
res.download(<sourcefilepath>, <downloadfilename>);

參考

package.json說明:http://javascript.ruanyifeng.com/nodejs/packagejson.html#toc0

相關推薦

nodejsSVG圖片下載方案

var phantom = require('phantom'); var fs = require('fs'); var express = require('express'); var app = express(); app.get('/download', function(req, res) {

PDF轉換技巧WPS圖片

  經常聽到有人問WPS轉圖片怎麼轉?WPS如何轉圖片?WPS轉圖片,不管是現在的生活、工作、學習,使用一些辦公檔案都是常有的事。但檔案格式有很多,有常用的不常用,都會涉及到,遇到了就不知道怎麼辦。下面就講一下WPS轉換為圖片的操作步驟!   WPS轉圖片準備工作   電腦   瀏覽器   P

Android應用開發PDF圖片功能實現

一、概述 轉眼畢業小兩年了,回想這兩年寫的程式碼,不由得想起了上學那會兒某位網際網路大牛說,搞IT這行如果你沒有寫夠十萬行程式碼,那你就還沒有入門,俺這個時候真的有點汗顏啊,此處省略十萬字。小編最近開始整理這兩年寫的程式碼,不由得首先想起了今天要寫的這個功能—

python當爬蟲遇到了防盜鏈__天涯圖片下載andweibo微博圖片下載

圖片下載被禁,試了加標頭檔案、加防盜鏈,失敗orz= = url:http://bbs.tianya.cn/post-funinfo-6678943-1.shtml 圖片url:http://img3.laibafile.cn/p/l/229969207.jpg 首先試著下載圖片:s = requests.

JAVA文件復制 圖片下載

處理 tar malformed void close pub 自動 width 自己 用java打造屬於自己的爬蟲 網絡上的圖片太多 一個一個的保存實在太浪費時間 基於此 就使用了java做了一個小工具 功能是文件的復制 以及 網絡上圖片的下載 首先是IOUtlis類的創

SVG格式圖片成HTML中SVG的Path路徑

顏色 工具 back spa 如果 .org 彈出 技術分享 pyc AI圖標制作完成之後,保存的svg文件包含許多AI的信息,如果要在HTML中使用,我們需要在svg文件中提取/修改信息,重新保存。 1、在AI中已經完成圖標,要保存SVG文件,點擊“文件(File)”-

android mvp高速開發框架介紹(dileber使用圖片下載工具)

net com 例如 下載 pop bug span 介紹 launcher 這幾天忙著工作~ 今天抽時間又把框架的bug處理了一下~~並且把volley的源代碼改

Python爬蟲多線程下載豆瓣Top250電影圖片

process current ocs code roc 輸出 wait div 允許 爬蟲項目介紹 ??本次爬蟲項目將爬取豆瓣Top250電影的圖片,其網址為:https://movie.douban.com/top250, 具體頁面如下圖所示: ??本次爬蟲項目將分別

微信小程式canvas畫圖生成圖片下載

要實現的功能:點選朋友圈按鈕彈出分享圖片:點選儲存分享圖片儲存到手機實現程式碼:1.分享按鈕點選事件 /** * 分享 */ weixinShare:function(){ var that = this; console.log(111); share.canvas

php 圖片svgbase64格式

背景:做一個圖形驗證碼,原來的接口出來的是svg格式,但前端人員反饋小程式不能處理svg,希望可以轉成base64格式            但是網上大量檢視,並沒有發現有效的php處理方式,只查到了js處理,於是,根據js的函式,

html 圖片下載瀏覽器預設會開啟新頁面預覽圖片解決方案

      我們使用a標籤下載圖片的時候,瀏覽器預設會開啟新頁面預覽圖片,無法呼叫瀏覽器下載。       解決方案1:前端在a標籤加入download指定圖片下載,但是有相容性,並且限制也比較多

前端路:網頁內容圖片,並且複製網頁內容,並且優化體驗。(截圖外掛Clipboard.js 的使用)。

做專案遇到一個比較奇葩的需求,覺得很有意思,記錄下。方便以後回憶。 涉及框架(html2canvas.min.js   clipboard.mn.js): 直接連cdn <script src="https://cdn.bootcss.com/jquery/3.3

html 圖片下載瀏覽器預設會開啟新頁面預覽圖片解決方案

我們使用a標籤下載圖片的時候,瀏覽器預設會開啟新視窗預覽該圖片,無法呼叫瀏覽器下載。 解決方案1:前端在a標籤加入download指定圖片下載,但是有相容性,並且限制也比較多 解決方案2:使用瀏覽器自帶指令 SaveAs 來下載圖片,但是這個指令相容IE 解決

SVGCanvas並新增背景圖片進行上傳

SVG是什麼 SVG是很早之前就出來的通過xml格式來定義並渲染向量圖片的一種方式,因為是類似Dom節點的格式,所以xml節點可以像Dom一樣,可以通過js或者jQuery直接獲取並修改。好處就是因為是向量圖,所以放大縮小不失真,一般地圖開發中使用最多。 Ca

CIFAR-10 dataset 的下載與使用、圖片

基本資訊 CIFAR-10 是一個包含60000張圖片的資料集。其中每張照片為32*32的彩色照片,每個畫素點包括RGB三個數值,數值範圍 0 ~ 255。 所有照片分屬10個不同的類別,分別是 ‘airplane’, ‘automobile’, ‘bird’,

iOS【多執行緒網路圖片下載框架SDWebImage】

效果: 程式碼: - (NSArray *)apps { if (!_apps) { NSArray *dictArray = [NSArray arrayWithContentsOfFile:[[NSBundle mainBundle] pat

Java PowerPoint圖片、PDF、XPS和SVG等格式檔案

這篇文章介紹如何在Java應用程式中將PowerPoint文件轉換為圖片、PDF、XPS和SVG等格式。 使用元件: Free Spire.Presentation for Java 元件簡介:Free Spire.Presentation for Java是一個免費Java Power

Discuz!論壇教程去掉附件圖片提示下載框方法

預設圖片滑鼠移動過去會顯示圖片名和下載,有些Discuz!站長需要讓帖子內容頁面更美觀,可以使用以下辦法去除。 模板路徑\template\default\forum\discuzcode.htm 搜尋 <img{if $attach['price'] &&a

防止圖片重複下載方案,影象壓縮儲存與壓縮顯示

圖片作為超級吃流量的東東,如何避免它重複下載和佔用大量記憶體開啟圖片呢?如何避免圖片本地沒有正在下載過程而重複下載呢? 影象壓縮儲存與壓縮顯示:通常使用UIImagePNGRepresentation的方式儲存本地檔案,它的好處是若該圖片背景為透明可以保證它的

svg成png並下載

要實現點選一個按鈕,將介面上相應的svg轉成png圖片並下載。 html程式碼如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">