整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
preadJS純前端表格控件是基于HTML5的JavaScript電子表格和網格功能控件，適用于.NET、Java和移動端等各平臺在線編輯類Excel功能的表格程序開發。
本文介紹了如何實現SpreadJS的自定制打印功能。
Spread.Sheets 提供了很多打印設置給用戶，用來決定打印什么和如何打印。
以下內容是可以打印的。
在列頭/行頭/表單視圖區域的可見行和可見列
單元格的文本
單元格的樣式 (包括背景圖)
單元格合并信息
單元格溢出文本
圖片
以下內容無法被打印。
隱藏的行和列
浮動對象
備注
表單名稱標簽
滾動條
分組
篩選按鈕
校驗按鈕和高亮紅色提示圈
活動狀態
選擇
凍結線
Spread的背景圖
1. 可以通過調用 Workbook的print方法來打印整個表單或打印指定表單。
spread.print(); // print all sheets
2. 在每一個表單，你可以通過調用 Worksheet的setRowPageBreak / Worksheet的setColumnPageBreak 方法在指定行和指定列插入分頁符。
3. 在每一個表單，你可以通過調用Sheet.printInfo方法來這是打印的詳細設定。這里是一些可選項：
showGridLine: 是否打印網格線 (默認是打印)。
showBorder: 是否打印控件的外邊框線。
showColumnHeader / showRowHeader: 是否打印列頭/行頭， 參數為PrintVisibilityType枚舉值。
inherit: 繼承自表單的設置 ((默認) 行頭/列頭可見)。
hide: 不打印。
show: 在每頁中都顯示。
showOnce: 顯示一次 (在第一頁)。
rowStart: 設定打印區域的開始行索引。
rowEnd: 設定打印區域的結束行索引。
columnStart: 設定打印區域的開始列索引。
columnEnd: 設定打印區域的結束列索引。
repeatColumnStart: 設定在每頁左邊打印重復區域的開始列索引。
repeatColumnEnd: 設定每頁左邊打印重復區域的結束列索引。
repeatRowStart: 設定每頁上邊打印重復區域的開始行索引。
repeatRowEnd: 設定每頁上邊打印重復區域的結束行索引。
headerLeft: 表頭區域左部分的文本及樣式。
headerCenter: 表頭區域中間部分的文本及樣式。
headerRight: 表頭區域右部分的文本及樣式。
footerLeft: 表腳區域左部分的文本及樣式。
footerCenter: 表腳區域中間部分的文本及樣式。
footerRight: 表腳區域右部分的文本及樣式。
headerLeftImage: 表頭區域左部分的圖片。
headerCenterImage: 表頭區域中間部分的圖片。
headerRightImage: 表頭區域右部分的圖片。
footerLeftImage: 表腳區域左部分的圖片。
footerCenterImage: 表腳區域中間部分的圖片。
footerRightImage: 表腳區域右部分的圖片。
supported format: & 被用作為特殊的轉義字符，用來轉義以下打印特殊數據的關鍵字。
P: 當前頁數。
N: 總頁數。
D: 當前日期。（今天）
T: 當前時間。
G: 圖片，用來顯示相應區域圖片（XXXImage）的占位符。
S: 刪除線。
U: 下劃線。
B: 粗體。
I: 斜體。
": (雙引號)，用來設置字體。
F: Spread的名字。
A: 表單名字。
試用SpreadJS，請通過以下方式聯系我們：
微信：GrapeCityDT
郵件：marketing.xa@grapecity.com
官網：www.gcpowertools.com.cn
葡萄城是一家跨國軟件研發集團，專注控件領域近30年，是全球最大的控件提供商，也是微軟認證的金牌合作伙伴。
tml5的流行近一兩年，在國內主要是移動端和html5游戲的發展，國外也是最近紛紛使用html5，如谷歌，全面的停止flash的廣告的投放量，用html5取代之，那么html5較html的區別在哪里了，下面就簡單地談談，列舉了13條區別。
1.html5和html的概念
我們現在web前端開發的靜態網頁，一般都是html4.0。同時是符合W3C的xhtml1.0規范來的。HTML4已經10多年了，不會有任何改變了。
html5的定義比較長，就說簡單和好理解點，可以簡單點理解成：HTML 5 ≈ HTML4.0+CSS3+JS+API 。首先要注意的是，HTML5雖然現在很火，但是HTML5標準還在制定中，標準仍在改變。
2.在文檔類型聲明上的不同
html顯得格外冗長，在大多數人書寫代碼，都是靠編輯工具自動生成。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
html5卻是不同，只有簡簡單單的聲明，這也方便人們的記憶，更加精簡。
<!DOCTYPE html>
3.在結構語義上
html4.0：沒有體現結構語義化的標簽，我們通常都是這樣來命名的
<div id="header"></div>
這樣表示網站的頭部。
html5：在語義上卻有很大的優勢。提供了一些新的html5標簽，比如:<header><nav ><article><aside><footer>
4. 簡化的語法
HTML5簡化了很多細微的語法，例如doctype的聲明，你只需要寫<!doctype html>就行了。HTML5與HTML5，XHTML1兼容，但是與SGML不兼容。
5. <canvas>標簽替代Flash
Flash給很多Web開發者帶來了麻煩，要在網頁上播放Flash需要一堆代碼和插件。<canvas>標簽使得開發者只要使用一個標簽就 能和用戶產生UI交互。雖然目前<canvas>標簽還不能實現Flash的所有功能，但是很快<canvas>就會讓 Flash看起來老土，哈哈！
6. 新增 <header> 和 <footer> 標簽
HTML5設計的一個原則是更好的體現網站的語義性，所以增加了<header>和<footer>這樣的標簽，用來明確表示網頁的結構。
7. 新增 <section> 和 <article> 標簽
與<header>, <footer>類似，<section>和<article>也有利于清晰化網頁的結構，更有利于SEO。
8. 新增 <menu> 和 <figure> 標簽
<menu>可以被用于創建傳統的菜單，也可以用于工具欄和上下文菜單。<figure>標簽使得網頁文字和圖片的排版更專業。
9. 新增 <audio> 和 <video> 標簽
這兩個標簽可能是HTML5里面最有用的兩個標簽了。顧名思義，這兩個標簽是用來播放音頻和視頻的。
可能在html4.0的時候，我們想要插入一段視頻，還需要引用一長段的代碼。但是在html5的情況下。我們只需要用于一個video標簽即可。
<video src - "視頻地址" ></wideo>
提供這樣的標簽有什么樣的好處呢？
第一：節省程序員寫代碼的時間。
第二：我覺得最主要還是在SEO的優化上。
不管是我們自己來對網頁模塊命名，還是有這樣的標簽。因為做網站最終的目的只有一個，那就是盈利。想盈利的話，就只有通過SEO優化的技術，把你網站排名做上來，這樣你的網站才有價值，且正是這一點，html5符合了這一點。為什么這么說呢？因為他定義的這些標簽，更加有利于優化，蜘蛛能識別你。
10. 全新的表單
HTML5對 <form> 和 <forminput> 標簽進行了大量修改，添加了很多新的屬性，也修改了很多屬性。
11. 刪除 <b> 和 <font> 標簽
這個改進我還無法理解。我不認為刪除這兩個標簽對代碼的改進有很大的幫助。官方的解釋是應該用CSS來替代這兩個標簽。但我還是覺得對于簡單的文本，這兩個標簽還是很方便的。
12. 刪除 <frame>, <center>, <big> 標簽
我已經記不得上次是什么時候使用這些標簽了。
13. 強大的繪圖功能
可能有些動畫，或者圖片，在html5可以通過強大的繪畫功能，加上JS可以實現。而在html4.0卻不行。
在HTML5中，有兩個東西，是可以進行繪圖的，我們一起來看看是哪兩個神奇的玩意。
1.Canvas標簽
Canvas 通過 JavaScript 來繪制 2D 圖形，Canvas 是逐像素進行渲染的。
在 canvas 中，一旦圖形被繪制完成，它就不會繼續得到瀏覽器的關注。如果其位置發生變化，那么整個場景也需要重新繪制，包括任何或許已被圖形覆蓋的對象。
SVG
SVG 是一種使用 XML 描述 2D 圖形的語言，SVG 基于 XML，這意味著 SVG DOM 中的每個元素都是可用的。您可以為某個元素附加 JavaScript 事件處理器。在 SVG 中，每個被繪制的圖形均被視為對象。如果 SVG 對象的屬性發生變化，那么瀏覽器能夠自動重現圖形。
與其他圖像格式相比（比如 JPEG 和 GIF），使用 SVG 的優勢在于：
（1）SVG 圖像可通過文本編輯器來創建和修改
（2）SVG 圖像可被搜索、索引、腳本化或壓縮
（3）SVG 是可伸縮的
（4）SVG 圖像可在任何的分辨率下被高質量地打印
（5）SVG 可在圖像質量不下降的情況下被放大
那么都兩者都可以用于繪圖，我們一起來看看他們之間有何區別：
Canvas
1.依賴分辨率
2.不支持事件處理器
3.弱的文本渲染能力
4.能夠以 .png 或 .jpg 格式保存結果圖像
5.最適合圖像密集型的游戲，其中的許多對象會被頻繁重繪
SVG
1.不依賴分辨率
2.支持事件處理器
3.最適合帶有大型渲染區域的應用程序（比如谷歌地圖）
4.復雜度高會減慢渲染速度（任何過度使用 DOM 的應用都不快）
5.不適合游戲應用
html5和html的區別甚多，就不在一一列舉了。
切圖網（qietu.com）是一家專門從事web前端開發的公司，專注we前端開發，關注用戶體驗，歡迎訂閱微信公眾號：qietuwang
說，華麗的HTML5浪潮已經打濕了眾多網站設計師，而且還將繼續在國內刮起龍卷風。
首先，HTML5的出現會使得手機中的原生態APP減少。因為HTML5能夠產生一種假的APP，使得用戶無需下載安裝APP，而是通過利用手機瀏覽器運行。
第二，HTML5的出現大大節省了人們的開發成本。因為它通吃PC、Mac、iPhone、iPad、Android、Windows Phone等跨語言平臺。程序員們再也不必為不同款的手機做不同的APP了。
第三，HTML5的出現使得手機里可以不用再有Flash了。因為HTML5就有這種魔力使得我們觀看多媒體時不必安裝Flash等第三方插件。
第四，由于第三方插件的減少，手機得到了減肥瘦身，那么手機電量自然也會相對持久一些。
第五，HTML5使得手機定位服務更便捷，因為它實現了基于地理位置的功能，想定位，直接點擊“附近”就能輕松搞定。
第六，HTML5使得設計師們可以設計出更加美觀、更加炫酷的網頁，創造出更加有強大視覺效果的界面。
看到這里，你對HTML5動心了嗎？下面為大家介紹一個HTML5的酷炫功能——定位系統！
Geolocation
HTML5 的 geolocation 是一個令人興奮的 API，通過這套 API，Javascript 代碼就能夠訪問到用戶的當前位置。當然，訪問之前必須得到用戶的明確認可，即同意在頁面共享位置。如果頁面嘗試訪問地理位置信息，瀏覽器就會顯示一個對話 框，請求用戶許可共享其地理位置信息，比如這樣：
用戶同意（允許）之后，Geolocation 的 api 就能起作用了。
getCurrentPosition 方法
Geolocation API 在瀏覽器中的實現是 navigator.geolocation 對象，這個對象包含 3 個方法。第一個方法是 getCurrentPosition，調用這個方法就會觸發請求用戶共享地理定位信息的對話框。這個方法接收 3 個參數：成功回調函數，可選的失敗回調函數和可選的選項對象。
其中，成功回調函數會接收到一個 Position 對象參數，該對象有兩個屬性：coords 和 timestamp。而 coords 對象中將包含下列與位置相關的信息。
latitude：以十進制度數表示的維度
longtitude：以十進制度數表示的經度
accuracy：經緯度坐標的精度，以米為單位
有些瀏覽器可能會在 coords 對象中提供如下屬性。
altitude：以米為單位的海拔高度，如果沒有相關數據則值為
altitudeAccuracy：海拔高度的精度，以米為單位，數值越大越不精確
heading：指南針的方向，0°表示正北，值為 NaN 表示沒有檢測到數據
speed：速度，即每秒移動多少米，如果沒有相關數據則值為
說了這么多，我們來簡單應用下，寫一段代碼獲取當前的經緯度，然后輸出：
navigator.geolocation.getCurrentPosition(geo_success, geo_error);
function geo_success(position) {
console.log(position.coords.latitude, position.coords.longitude);
}
function geo_error(msg) {
console.log(msg.code, msg.message);
}
代碼很簡單，如果請求成功了就執行 geo_success 函數，打印經緯度，如果失敗了，輸出一些信息（失敗回調）。
getCurrentPosition 的第二個參數，即失敗回調函數，在被調用的時候也會接收到一個參數。這個參數是一個對象，包含兩個屬性：message 和 code。 其中，message 屬性中保存著給人看的文本消息，解釋為什么會出錯，而 code 屬性中保存著一個數值，表示錯誤的類型：用戶拒絕共享（1），位置無效（2）或者超時（3）。實際開發中，大多數 Web 應用只會講錯誤消息保存到日志文件中，而不一定會修改用戶界面。
我們在 PC 端的 chrome 瀏覽器中執行這段代碼，結果是令人遺憾的：
掐指一算，估計是被墻了... 事實上，以 Chrome 瀏覽器為例，如果您允許 Chrome 瀏覽器與網站共享您的位置，Chrome 瀏覽器會向 Google 位置服務（此環節被墻）發送本地網絡信息，估計您所在的位置。然后，瀏覽器會與請求使用您位置的網站共享您的位置。
接著在 Android 機上測試了下，沒被墻，畢竟谷歌是 Android 的親爹啊。打印出來的信息如下：
31.188199 121.632919
當然只是知道經緯度或許不太那么直觀，如果能把位置顯示在地圖上那就直觀多了！這里我用了高德地圖的API（猛戳這里看效果）：
<!doctype html>
<html>
<head>
<meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
<title>地圖顯示</title> <link rel="stylesheet" />
<script src="http://webapi.amap.com/maps?v=1.3&key=您申請的key值"></script> </head> <body> <div id="mapContainer"></div>
<script> navigator.geolocation.getCurrentPosition(geo_success, geo_error); function geo_success(position)
{ var map = new AMap.Map('mapContainer',
{ // 設置中心點 center: [position.coords.longitude, position.coords.latitude], // 設置縮放級別 zoom: 13 });
var marker = new AMap.Marker
({ //復雜圖標 icon: new AMap.Icon({ //圖標大小 size: new AMap.Size(28, 37), //大圖地址 image: "http://webapi.amap.com/images/custom_a_j.png",
imageOffset: new AMap.Pixel(-28, 0) }), //在地圖上添加點 position: [position.coords.longitude, position.coords.latitude] }); marker.setMap(map); }
function geo_error(msg) { console.log(msg.code, msg.message); } </script> </body> </html>
在手機上打開后：
我的天哪！實在是太準了！如果我把代碼里的 zoom 參數再加大點，能精確到小區了...當然，這并不奇怪，因為這本來就是高德地圖百度地圖定位的一部分嘛。
事實上，getCurrentPosition 還有第三個參數，該參數是一個選項對象，用于設定信息的類型。可以設置的選項有三個：enableHighAccuracy 是一個布爾值，表示必須盡可能使用最精確的位置信息；timeout 是以毫秒數表示的等待位置信息的最長時間；maximumAge 表示上一次取得的坐標信息的有效時間，以毫秒表示，如果時間到則重新取得新坐標信息。
除非確實需要非常精確的信息，否則建議保持 enableHighAccuracy 的 false 值（默認值）。將這個選項設置為 true 需要更長的時候，而且在移動設備上更耗電。類似的，如果不需要頻繁更新用戶的位置信息，那么可以將 maximumAge 設置為 Infinity，從而始終都使用上一次的坐標信息。
navigator.geolocation.getCurrentPosition(locationSuccess, locationError, {
// 指示瀏覽器獲取高精度的位置，默認為false
enableHighAcuracy: true,
// 指定獲取地理位置的超時時間，默認不限時，單位為毫秒
timeout: 5000,
// 最長有效期，在重復獲取地理位置時，此參數指定多久再次獲取位置。
maximumAge: 3000
});
watchPosition 方法
如果要跟蹤用戶的位置，那么可以使用 watchPosition 方法。這個方法的使用和 getCurrentPosition 完全相同。實際上 watchPosition 與定時調用 getCurrentPosition 能得到相同效果。在第一次調用 watchPosition 方法后，會取得當前位置，執行成功回調或者錯誤回調。然后，watchPosition 就地等待系統發出位置已改變的信號。
調用 watchPosition 會返回一個數值標識符，用于跟蹤監控的操作。基于這個返回值可以取消監控操作，只要將其傳遞給 clearWatch 方法即可（與使用 setTimeout() 和 clearTimeout() 類似），例如：
var watchId = navigator.geolocation.watchPosition(geo_success, geo_error);
clearWatch(watchId);
Geolocation 定位原理
Geolocation API 的數據來源可能是 GPS、IP 地址、RFID、WiFi、藍牙 MAC 地址、GSM/CDMA 卡 ID 等。因為 Geolocation API 是運行在你本地設備上的。所以，在使用 VPN 或代理的情況下，Geo API 仍能獲得你準確的 IP 地址信息（除非因為某些因素瀏覽器獲取不到這些信息）。
在HTML5的實現中，手機等移動設備當然優先使用GPS定位，而筆記本和部分平板，最準的定位是WIFI，至于網線上網的臺式機，一般就只能使用IP來定位了，這個準確度最低。
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
