Python讀取HTML中的canvas並且以圖片形式存入Word檔案

2022-08-15 22:01:06

前言

朋友提問：

建立Word檔案並插入

市面上有很多圖表繪製庫，例如echarts和highcharts等等。對於這種由js動態繪製的圖表，我們只能控制遊覽器自動截圖存入word，

完整程式碼如下：

from docx import Document
import os
from selenium import webdriver

browser = webdriver.Chrome()
# 調整遊覽器大小達到調整圖表寬度的目的
browser.set_window_size(540, 1024)
url = "file://" + 
    os.path.abspath("html/awrcrt_MESDB_1_21369_21373.html").replace("\", "/")
browser.get(url)

doc = Document()
for canvas in browser.find_elements_by_tag_name("canvas"):
    canvas.location_once_scrolled_into_view
    canvas.screenshot("tmp.png")
    doc.add_picture("tmp.png")
doc.save("img.docx")

然後我們得到Word檔案：

插入到已存在的Word檔案指定的位置

後面朋友又反饋，只需要插入HTML中的指定幾張圖表到現有Word檔案的指定位置。

待插入的圖表元素都有對應的ID可以定位：

那我們只需要對Word檔案要插入的位置進行標記，模板如下：

然後完整程式碼如下：

from docx.shared import Mm
from docxtpl import DocxTemplate, InlineImage
from docx import Document
import os
from selenium import webdriver

browser = webdriver.Chrome()
# 調整遊覽器大小達到調整圖表寬度的目的
browser.set_window_size(540, 1024)
url = "file://" + 
    os.path.abspath("html/awrcrt_MESDB_1_21369_21373.html").replace("\", "/")
browser.get(url)

tpl = DocxTemplate("資料庫效能概覽_模板.docx")
canvas_ids = ["canvas_cpu", "canvas_conn",
              "canvas_commit", "canvas_logon", "canvas_event"]
context = {}
context["dbname"] = "MESDB"
for canvas_id in canvas_ids:
    canvas = browser.find_element_by_id(canvas_id)
    canvas.location_once_scrolled_into_view
    canvas.screenshot(f"{canvas_id}.png")
    context[canvas_id] = InlineImage(tpl, f"{canvas_id}.png", width=Mm(165))
tpl.render(context)
tpl.save("資料庫效能概覽.docx")
browser.close()

生成結果：

到此這篇關於Python讀取HTML中的canvas並且以圖片形式存入Word檔案的文章就介紹到這了,更多相關Python讀取canvas內容請搜尋it145.com以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援it145.com！

Python讀取HTML中的canvas並且以圖片形式存入Word檔案

目錄

前言

建立Word檔案並插入

插入到已存在的Word檔案指定的位置

熱門文章