レベル: 初心者
SAS、JMPソフトウェア開発者、ジョシュ・マークワード氏
SAS、JMP 主任ソフトウェア開発者、ジョン・パウエル
インタラクティブHTMLは、ポイントの識別、リンク、ブラッシング、そしてJMP 14の新機能であるデータフィルタリングなど、JMPの多くの探索機能をサポートしています。保存したレポートは同僚と共有したり、Webサーバーにアップロードして最新のWebブラウザーで閲覧したりできます。JMP 14のインタラクティブHTMLは、データフィルタリングのサポートに加えて、グラフビルダーのツリーマップもサポートします。本稿では、インタラクティブHTMLを使用してJMPの結果を共有および探索するタイミングと方法を説明します。
導入
JMP 11のインタラクティブHTMLプロジェクト開始以来、私たちの目標は、JMPをまだお持ちでない方にもJMPの豊富なグラフィックと強力な分析機能をご利用いただけるようにすることです。Webは、これらのレポートを表示するのに最適な場所であり、現代においてコラボレーションの場となっています。この講演では、JMP 14のインタラクティブHTMLの新機能の概要、JMPインタラクティブHTMLレポートをWeb上で共有する方法のヒント、そして海洋生物学者がJMPのインタラクティブHTMLを使用して研究成果を共有・共同作業している事例をご紹介します。
Diamond Price vs. Carat Weight, Filtered by Colorダイヤモンドの価格とカラット重量、色別
ダイヤモンドの価格とカラット重量、色別
ダイヤモンドの価格とカラット重量、色別
JMP 14の機能
JMPには、データ分析のための様々なプラットフォームとツールが搭載されています。リリースごとに、Web上でのデータの探索と共有を容易にするために、出力機能に新たな機能を追加してきました。JMP 14では、グラフビルダーの出力にツリーマップが追加され、非表示と選択が可能なデータフィルターがデータの探索に利用できるようになりました。
インタラクティブなHTMLレポートは、JMPの多くの探索的機能をサポートしています。個々のポイントやグラフ要素は、デスクトップではマウスオーバー時に表示されるツールヒント、モバイルデバイスではタップ時に表示されます。JMPと同様に、グラフはリンクされており、あるグラフで選択された行はすべてのグラフでハイライト表示されます[1,2]。
Selecting multiple objects and linking between graphical elements複数のオブジェクトを選択し、グラフィカル要素間のリンクを設定します。複数のオブジェクトを選択し、グラフィカル要素間のリンクを設定します。複数のオブジェクトを選択し、グラフィカル要素間のリンクを設定します。ページ上部に表示されるさまざまなモードを利用し、 2番目のトグルボタンをクリックまたはタップすることで、グラフ内の行を選択するために四角形をドラッグできます。これはブラッシングと呼ばれ、多変量データの探索に重要な手法です[1]。 
Brushing points to explore the dataデータを探索するためのブラッシングポイントデータを探索するためのブラッシングポイントデータを探索するためのブラッシングポイント
JMP 14の新機能として、列または列の組み合わせでフィルタリングできるようになりました。まず、JMPレポートの赤い三角メニューから「ローカルデータフィルター」メニュー項目を選択し、1つまたは複数の列を選択して「追加」をクリックします。カテゴリカルフィルターと連続フィルターの両方のコントロールがサポートされており、分布で装飾されています。JMP 14では、ANDロジックとORロジックのあらゆる組み合わせがサポートされているため、複雑なフィルターを作成できます。選択状態と非表示状態はどこでも一貫した方法でサポートされているため、JMPを初めて使用するユーザーでも簡単に学習できます。
インタラクティブHTML出力をファイルに公開する際、データの除外/包含機能はサポートされていないことにご注意ください。つまり、JMPで行を除外した場合、包含された行のサブセットのみがエクスポートされ、ユーザーは除外されたデータをWeb上で閲覧することはできません。例えば、以下の二変量プロットでは、「包含」チェックボックス（JMPの左側）がオンになっているため、「男性」を選択すると、表示される点は男性のみとなり、直線の当てはめの際に考慮される値は男性のみとなります。したがって、このグラフのインタラクティブHTMLエクスポートでは、データフィルター（右側）には男性のみが含まれます。 
Bivariate of Big Class with only Males included before exporting to Interactive HTMLインタラクティブ HTML にエクスポートする前の、男性のみを含むビッグクラスの二変量データインタラクティブ HTML にエクスポートする前の、男性のみを含むビッグクラスの二変量データ インタラクティブ HTML にエクスポートする前の、男性のみを含むビッグクラスの二変量データ ユーザーが男性と女性の両方の身長を調べることができるようにしたいが、最初は男性に注目させたい場合は、男性を選択してエクスポートする前に、「含める」チェックボックスをオフにします (左側の JMP に示すように)。ここで、インタラクティブ HTML の最初のグラフは最初と同じですが、データ フィルターによって男性と女性の両方が含まれ、フィルター処理によってデータセット全体、またはいずれかの性別を個別に調べることができることがわかります。 
Unchecking the Include checkbox allows you to show just the Males initially but still allow the user to explore the entire dataset. 「含める」チェックボックスをオフにすると、最初は男性のみが表示されますが、ユーザーはデータセット全体を探索できます。 「含める」チェックボックスをオフにすると、最初は男性のみが表示されますが、ユーザーはデータセット全体を探索できます。 「含める」チェックボックスをオフにすると、最初は男性のみが表示されますが、ユーザーはデータセット全体を探索できます。ツリーマップは、階層データを分析するための重要なグラフィカルツールです。以下は、サンプルデータライブラリの都市データセットから、デフォルトで選択されている分割アルゴリズムを使用して作成されたツリーマップです。
Treemap of Cities data sized by lead levelsリードレベル別にサイズ分けされた都市データのツリーマップ
リードレベル別にサイズ分けされた都市データのツリーマップ
リードレベル別にサイズ分けされた都市データのツリーマップ
分割アルゴリズムは、セルをセルグループの名前で並べたツリーマップを作成します。あるいは、正方形化アルゴリズムを選択して、セルをサイズ（この場合は都市のリードレベル）で並べたツリーマップを作成することもできます。
Treemap of the Cities by lead levels using the squarify algorithmスクエア化アルゴリズムを使用したリードレベル別の都市のツリーマップ
スクエア化アルゴリズムを使用したリードレベル別の都市のツリーマップ
スクエア化アルゴリズムを使用したリードレベル別の都市のツリーマップ
エクスポートされた HTML ツリーマップは、JMP 14 で JMP からエクスポートする前に設定したすべてのオプションをサポートします。ローカル データ フィルターと組み合わせることで、Web 上でツリーマップやその他のグラフ タイプを探索できます。
JMPで共有する方法
以前のプレゼンテーションでは、Windowsでは「ファイル」→「名前を付けて保存」メニューオプション、Macでは「エクスポート」を使用してJMPレポートをインタラクティブHTML形式で保存する方法、そしてスクリプトからこのコンテンツを作成するためのSave Interactive HTML() JSLコマンドの使用方法を紹介しました[3]。ダッシュボードビルダーを使用するか、 オンラインサンプルで示されているように「Windowsの結合」機能を使用することで、強力なダッシュボードを作成できます。しかし、これらのレポートを共有する最適な方法は何でしょうか？
この質問への答えは、ファイルをどの程度広く共有したいかによって異なります。社内ネットワーク内では、シンプルな共有ネットワーク ドライブが最善の方法かもしれません。メールの設定によっては、HTML コンテンツがブロックされたり、大きな添付ファイルを個人のマシンやモバイル デバイスにダウンロードするよう強制されたりすることがあります。オンライン ファイル共有サービスはさまざまですが、サポート内容はさまざまです。2017 年 9 月現在、 Dropbox は HTML コンテンツをレンダリングしなくなりました。同様に、 Google Drive も 2015 年にこの機能を廃止しました。現時点では、レンダリングされた HTML コンテンツを交換するための信頼性の高い方法としてファイル共有サービスをお勧めすることはできません。ファイルを共有することはできますが、ダウンロードするか、リンクをクリックしてレポートを表示したい場合にテキスト ファイルとして表示される可能性があります。
フル機能のウェブサーバーを自社で管理することに不安のあるお客様向けに、プログラミングの知識がほとんどなくてもウェブサイトを迅速に開発できると謳うホスティング/ウェブデザインサイトがいくつかあります。インラインフレームまたはiframeと呼ばれるHTML要素は、あるウェブページのコンテンツを別のページに埋め込むために使用できます。例えば、JMP Communityではiframeによるコンテンツの埋め込みが許可されています。ただし、選択したプロバイダーによっては、システム内でiframeが許可されていない場合があります。ウェブページがHTTPSで配信されている場合、iframe内でHTTPコンテンツをホストすることはできません。これは「 Mixed Content（混合コンテンツ）」と呼ばれるシナリオであり、最新のブラウザのセキュリティ機能です。これは、お客様が使用しているフレームワークを考慮すると、実行可能なソリューションとなる可能性がありますが、以下のお客様の事例が示すように、ある程度の作業が必要になる場合があります。
コーラルリーフの顧客事例
データ共有機能は、既にお客様に効果を発揮しています。その一例として、アンダーソン・メイフィールド博士によるサンゴ礁診断研究 [4] が挙げられます。世界中のサンゴ礁から長年データを収集した後、博士はJMPを用いたデータと分析を共有するためのウェブサイトを作成しました。これにより、同じ分野の科学者や統計学者が協力して、変化する地球規模の気候変動におけるサンゴ礁の健全性を予測できるようになりました。彼のウェブサイトはSquareSpaceでホストされています。 
Dr Anderson B. Mayfield's webpageアンダーソン B. メイフィールド博士のウェブページアンダーソン B. メイフィールド博士のウェブページアンダーソン B. メイフィールド博士のウェブページ彼は、JMPのインタラクティブHTMLレポートを自身のウェブサイトに埋め込む方法についてJMPコミュニティに相談しました。しかし、SquareSpace [5]では直接サポートされていないようでした。コミュニティ、特にSquareSpaceの主任ソフトウェア開発者であるNascif Abousalh-Netoからの回答のおかげで、彼はインタラクティブHTMLファイルをAmazon S3にホストし、iframeを使用することで、収集したデータを説明するページの中央にインタラクティブHTMLレポートを埋め込むことができることを知りました。
JMP 14.2のリリースにより、JMP Publicが利用可能になったことで、JMPインタラクティブHTMLレポートでも同様のことが可能になり、ライブJMPサーバーへの接続によって高度な機能が提供されます。ユーザーはJMP Public上のレポートに直接リンクできるほか、システムによってレポートを他のプラットフォームに簡単に埋め込むことができ、iframe HTMLマークアップを生成して別のWebページに貼り付けることも可能です。スタンドアロンのインタラクティブHTMLとは異なり、データの除外や追加が可能で、JMPサーバーが分析を処理し、使い慣れたWebインターフェースで更新された結果を表示します。JMP Publicでは、洗練された新しいユーザーインターフェースが採用されています。
JMP Public に公開されたレポートを共有するには、ページ上部の共有アイコンをクリックし、以下に示すように「埋め込みコード (iframe)」を選択します。 
Embedding an iframe of interactive HTML reports published on JMP Public is easy. JMP Publicで公開されているインタラクティブなHTMLレポートのiframeを埋め込むのは簡単です。JMP Publicで公開されているインタラクティブなHTMLレポートのiframeを埋め込むのは簡単です。JMP Publicで公開されているインタラクティブなHTMLレポートのiframeを埋め込むのは簡単です。これにより、Webページ内にiframeタグを生成するHTMLコードが、以下のようにクリップボードに配置されます。
<IFRAME class="jmp-share-iframe" frameborder="0" width="800" height="600" src="https://public.jmp.com/api/packages/Diamond-Price-vs-Carat-Weight-Filtered-b/js-p/5bb3d86e615499085427cde3/indexPage" style="margin: 0.8em 0;"></IFRAME>
このコードを、HTML ページの表示したい場所に貼り付けるだけで (この論文の冒頭で示した画像のライブ バージョンで行ったように)、ページ内にインタラクティブなコンテンツが表示されます。
結論
インタラクティブHTMLは、JMPの4つのリリースでご利用いただけます。アンダーソン・メイフィールド博士が世界中のサンゴ礁の健全性向上に向けた共同研究に取り組まれたように、インタラクティブHTMLを皆様にもぜひご活用いただければ幸いです。皆様の成功事例や課題についてお聞かせいただき、JMPのインタラクティブHTMLレポートやダッシュボードを活用した共同作業の実現をサポートさせていただきます。 インタラクティブHTMLのサンプルをご覧いただくか、 JMP Publicに掲載されているこちらの論文のサンプルをご覧ください。
参考文献
[1] Becker R.とCleveland W. (1987). 「Brushing Scatterplots」, Technometrics , 127-142.
[2] Stuetzle W. (1987). 「プロットウィンドウ」アメリカ統計学会誌、82、466-475 。
[3] https://community.jmp.com/t5/Discovery-Summit-2017/Sharing-Interactive-Web-Reports-in-JMP-13/ta-p/44069
[4] http://coralreefdiagnostics.com
[5] https://community.jmp.com/t5/Discussions/posting-interactive-html-plots-on-websites/mp/60478
