Web_Design 板


LINE

各位好, 我目前在做的計劃是要比對PDF的格式 在google看了很久以後 發現jpedal的pdf->html5轉換的格式讓我很好處理 所以目前打算用這個方法來實作看看 (如果有更好的方法也麻煩告訴我!) 總之,jpedal轉換之後的html裡面包含了css的配置 轉換後的範例如下: #t5_1{left:124px;top:236px;letter-spacing:-0.1px;word-spacing:0.1px;} #t6_1{left:124px;top:251px;letter-spacing:-0.1px;word-spacing:0.3px;} #t7_1{left:124px;top:295px;} #t5_1這個同時也是一行文字的id <div id="t5_1" class="t s4_1">90089-0781, U.S.A</div> 然後有文字的格式內容 .s4_1{ FONT-SIZE: 54.8px; FONT-FAMILY: 'Times New Roman', Times, serif; color: rgb(0,0,0); FONT-STYLE: italic; } 所以整個頁面是以一行一行的文字為單位去做轉換 老闆那邊對於pdf的格式有規定的要求(不然找我來做格式系統幹嘛XD) 例如邊界,上下左右各2 inch 上下左這3個邊界處理起來沒有問題 拿個標準檔案來轉換inch px很容易判斷 但是右邊界我想了很久都不知道怎麼算 有想過的方法是用letter-spacing, word-spacing去算 一行的最後一個文字的位置應該可以用這個推出來? 不過我其實對css只有超級粗淺的概念 不懂為什麼letter spacing 怎麼會是-0.1px? (word spacing也是有正有負) 如果用spacing去計算的話,怎麼會是負值@@? 然後還有個要求是要看文字是否置中 我是想說這個基本是只要知道右邊界就可以知道了吧~ 去算該行文字的左邊界有沒有等於右邊界就好了 (或者各位有更好的方法也歡迎給我點建議) 怕大家不知道我在說什麼,在這邊附上圖片 http://imgur.com/SCfqoM6 謝謝各位了~(鞠躬) --



※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 97.93.122.75
※ 文章網址: https://webptt.com/m.aspx?n=bbs/Web_Design/M.1455906607.A.C43.html
1F:推 b35894814: 自己算一下,全頁-left-內文=right,不就可以了嗎?0.0 02/20 02:49
嗯... 內文好像可以用word or letter spacing 去計算? 目前只有一行的起始位置,也就是left是已知 計算的話,我的想法是起始位置+一行幾個字*字距 = 一行的最後一個字的位置 知道最後一個字的位置的話,就可以和頁面比較得出右邊界是否合於標準 不懂的地方是為什麼字距值可以是負的@@?
2F:推 mmis1000: 如果是不知道文字實際寬度,canvas有一個method可以算, 02/20 03:16
3F:→ mmis1000: 叫measureText 02/20 03:16
4F:→ mmis1000: 但算出來的結果不完全準確 02/20 03:19
5F:→ mmis1000: 一切還是以瀏覽器實際執行為準 02/20 03:19
6F:→ mmis1000: 像是 To 這種組合的寬度,並不等於 T + o 的寬度,因為 02/20 03:20
7F:→ mmis1000: 排版上可能會把o往內移進T裡面,算出來當然是錯的 02/20 03:21
好的 來查查看這個用法 看適不適合 另外...我是沒有考慮過瀏覽器的問題(其實是覺得不用考慮?) 大致的流程是: 使用者送出pdf檔案 ->系統轉換成html5+css ->有標準的html5+css的格式值和轉換過來的檔案比對 所以,我想瀏覽器執行應該不是我需要考慮的部份? 如果以上想法有誤麻煩告訴我~~~ 感激不盡>_< ※ 編輯: nosignal90 (66.215.98.249), 02/21/2016 12:48:51 ※ 編輯: nosignal90 (66.215.98.249), 02/21/2016 12:52:39







like.gif 您可能會有興趣的文章
icon.png[問題/行為] 貓晚上進房間會不會有憋尿問題
icon.pngRe: [閒聊] 選了錯誤的女孩成為魔法少女 XDDDDDDDDDD
icon.png[正妹] 瑞典 一張
icon.png[心得] EMS高領長版毛衣.墨小樓MC1002
icon.png[分享] 丹龍隔熱紙GE55+33+22
icon.png[問題] 清洗洗衣機
icon.png[尋物] 窗台下的空間
icon.png[閒聊] 双極の女神1 木魔爵
icon.png[售車] 新竹 1997 march 1297cc 白色 四門
icon.png[討論] 能從照片感受到攝影者心情嗎
icon.png[狂賀] 賀賀賀賀 賀!島村卯月!總選舉NO.1
icon.png[難過] 羨慕白皮膚的女生
icon.png閱讀文章
icon.png[黑特]
icon.png[問題] SBK S1安裝於安全帽位置
icon.png[分享] 舊woo100絕版開箱!!
icon.pngRe: [無言] 關於小包衛生紙
icon.png[開箱] E5-2683V3 RX480Strix 快睿C1 簡單測試
icon.png[心得] 蒼の海賊龍 地獄 執行者16PT
icon.png[售車] 1999年Virage iO 1.8EXi
icon.png[心得] 挑戰33 LV10 獅子座pt solo
icon.png[閒聊] 手把手教你不被桶之新手主購教學
icon.png[分享] Civic Type R 量產版官方照無預警流出
icon.png[售車] Golf 4 2.0 銀色 自排
icon.png[出售] Graco提籃汽座(有底座)2000元誠可議
icon.png[問題] 請問補牙材質掉了還能再補嗎?(台中半年內
icon.png[問題] 44th 單曲 生寫竟然都給重複的啊啊!
icon.png[心得] 華南紅卡/icash 核卡
icon.png[問題] 拔牙矯正這樣正常嗎
icon.png[贈送] 老莫高業 初業 102年版
icon.png[情報] 三大行動支付 本季掀戰火
icon.png[寶寶] 博客來Amos水蠟筆5/1特價五折
icon.pngRe: [心得] 新鮮人一些面試分享
icon.png[心得] 蒼の海賊龍 地獄 麒麟25PT
icon.pngRe: [閒聊] (君の名は。雷慎入) 君名二創漫畫翻譯
icon.pngRe: [閒聊] OGN中場影片:失蹤人口局 (英文字幕)
icon.png[問題] 台灣大哥大4G訊號差
icon.png[出售] [全國]全新千尋侘草LED燈, 水草

請輸入看板名稱,例如:BabyMother站內搜尋

TOP