起點課堂會員權益
職業體系課特權
線下行業大會特權
個人IP打造特權
30+門專項技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導直播
12場專業技能直播
會員專屬社群
榮耀標識Axure教程：高保真數據可視化原型
本文將介紹如何制作Axure高保真數據可視化原型，供大家參考和學習。
高保真數據可視化原型設計，稱得上是Axure高階水平。
數據可視化在原型設計中是一個重要的分支，但是對于Axure使用者具有一定要求。清晰的數據可視化原型可以減少與需求方和研發工程師等的溝通成本，且可具象。
Axure本身具有高級交互的能力，結合數據可視化的方式，以低成本的方式，達到預期的演示的效果，本文介紹如何制作Axure高保真數據可視化原型。
第1步：拖入內聯框架（Inline Frame）
在Axure操作界面中，拖入一個Inline Frame（中文：內聯框架）。
第2步：選擇帶有實例圖的HTML頁面
Axure本身可生成HTML頁面，本質上而言，只要帶有實例圖的為HTML文件，并可正常訪問即可。至于HTML是以何種方式制作生成，不做限制。
第3步：修改實例圖樣式，編輯HTML頁面代碼
點擊進入圖后，所示頁面如下圖。左側為折線圖效果對應的代碼，右側是折線圖的效果?？梢栽谧髠刃薷拇a，運行后可在右側查看修改后的效果（此處不做贅述）。
點擊頁面右下角的“Download”按鈕，下載折線圖的HTML頁面。
使用任意一種代碼編輯器（筆者喜歡用komodo），打開html頁面，修改html頁面代碼中自帶的api。如果發現運行后html報錯api過期時，需要自行創建api，將其進行替換。
第4步：創建一個新的文件夾
創建一個新的文件夾（本文命名其為：axure and excharts），文件夾的位置沒有要求。將下載的HTML頁面，放置在文件夾中。
第5步：使用Axure內聯框架鏈接文件夾中HTML頁面
雙擊拖入Axure操作界面的內聯框架（Inline Frame），選擇“link to an external url or file”（選擇一個外部的urd或文件），輸入HTML頁面所在的位置及名稱（如本文：D:\Desktop\axure and echarts\line-simple.html），如下圖所示：
第6步：Axure界面中操作生成html文件
點擊生成html頁面按鈕：
將生成html文件的目錄，更改為上文創建的文件夾。如下圖：
點擊確認后，“axure and echarts”文件夾中會存在axure生成的html頁面和html頁面。同時，會自動打開一個html頁面，可查看效果，如下圖：
這樣，我們就通過一個簡單的例子，在Axure中實現了數據可視化效果。
筆者在本文中分享的是實現的方法，但是實際應用過程中，通過一款數據可視化產品的視角去實操，會讓你有意想不到的效果，特別是在Axure顏色、布局、交互等能力的加持下。
作者：魚日，公眾號：issnail
本文由 @魚日 原創發布于人人都是產品經理。未經許可，禁止轉載
題圖來自Unsplash，基于CC0協議
有用
有個問題請教一下，這樣操作只能生成html文件才能查看效果，我預覽時是查看不了效果，是空白的。有方法可以解決嗎？因為要上傳藍湖，藍湖展示的就是預覽時的空白效果。
api怎么替換
太贊了！