Axure 9 文檔閱讀體驗優(yōu)化

功能特性

1. 節(jié)點突出顯示
   頁面名稱尾部加 * 符號

   
   
   image
   
   

   導出時會突出顯示

   
   
   image
2. 自動展開站點地圖
   瀏覽 Axure9 文檔時站點地圖不會自動展開，需要手動開啟，非常麻煩

3. 隱藏垃圾桶
   閱讀者不會看到垃圾桶及其子頁面的內(nèi)容

   
   
   image
4. 打開任意 .html 文件將統(tǒng)一定為到首頁（index.html）
   因為 Axure 導出的文檔，如果不是通過 index.html 或 start.html 打開則不會顯示左側(cè)的站點地圖，影響閱讀體驗
   
   image

使用方法

下載優(yōu)化后的 sitemap.js 、init.temp.js 文件（請看附件）

找到 Axure9 的安裝目錄，我是裝在 C 盤
C:\Program Files (x86)\Axure\Axure RP 9\DefaultSettings\Prototype_Files\plugins\sitemap\

先把上述目錄下的 sitemap.js 文件改下名稱，避免直接替換（后面不想用還可以切換回去）

image

粘貼優(yōu)化后的 sitemap.js 文件，最后是這樣

image

同理，將 init.temp.js 放到此目錄下：
C:\Program Files (x86)\Axure\Axure RP 9\DefaultSettings\Prototype_Files\resources\scripts\axure\

實現(xiàn)原理

Axure 導出/預覽文檔時會將 \Axure RP 9\DefaultSettings\ 文件復制到預覽對象中；
其中 sitemap.js 負責實現(xiàn)左側(cè)站點地圖的生成邏輯，通過修改其中的邏輯實現(xiàn)上述功能

sitemap.js

if (document.getElementById('sitemapControlFrameContainer').className == 'selected') {
            //如果站點地圖已經(jīng)展開則忽略
        } else {
            //如果站點地圖未展開
            $axure.player.showPlugin(1);//顯示或隱藏站點地圖
        }

// 如果節(jié)點名稱 = 垃圾桶，則隱藏此節(jié)點及其子節(jié)點
        if(hasChildren) {
            margin = (9 + level * 17);

            if(node.pageName=='垃圾桶'){
                returnVal = "<li class='sitemapNode sitemapExpandableNode' style='visibility:hidden'><div><div class='sitemapPageLinkContainer' style='margin-left:" + margin + "px'><a class='sitemapPlusMinusLink'><span class='sitemapMinus'></span></a>";
            }else{
                returnVal = "<li class='sitemapNode sitemapExpandableNode'><div><div class='sitemapPageLinkContainer' style='margin-left:" + margin + "px'><a class='sitemapPlusMinusLink'><span class='sitemapMinus'></span></a>";
            }

            // returnVal = "<li class='sitemapNode sitemapExpandableNode'><div><div class='sitemapPageLinkContainer' style='margin-left:" + margin + "px'><a class='sitemapPlusMinusLink'><span class='sitemapMinus'></span></a>";

        } else {
            margin = (19 + level * 17);
            returnVal = "<li class='sitemapNode sitemapLeafNode'><div><div class='sitemapPageLinkContainer' style='margin-left:" + margin + "px'>";
        }

// 如果節(jié)點尾部字符 = * 則設(shè)置特殊樣式
        if (node.pageName.substring(node.pageName.length - 1, node.pageName.length) == '*') {
            returnVal += "'></span><span class='sitemapPageName' style='color:#ff3366'>";
        } else if (node.pageName == '垃圾桶') {
            returnVal += "'></span><span class='sitemapPageName'>";
        } else {
            returnVal += "'></span><span class='sitemapPageName'>";
        }

init.temp.js

//如果不是從 index.html 打開頁面，則重定向到 index.html
        var myUrl = window.location.href; //當前頁面 URL
        var indexStart = myUrl.lastIndexOf('/')
        var thisUrl = myUrl.substring(indexStart + 1) //當前頁面名稱

        myUrl = myUrl.substring(0, indexStart + 1) //截取頁面名稱前的路徑
        myUrl = myUrl + 'index.html' //拼接路徑

        //是否存在父級頁面（存在則表示已經(jīng)在 index.html 中打開）
        if (window.top == window.self) {//不存在父頁面
            window.location.replace(myUrl); //重定向到 index.html
        } else {
            console.log('當前在 index.html 中打開')
        }