今まで,javascriptを直で書いたりとかしてましたが,よく考えたら,htmlをそのままiframeで埋め込むのが楽じゃないかという話です.
結果簡単にできました.
基本的な流れは,
1.2.は常識なので,3.4.をメモしておきます.
その前に
CDNサーバrawgitが終了
愛用していたRawGitが終了するとのことです.新たなアップロードは不可でこれまで上げたものは,2019/2までは参照可能とのことです.これまでブログに上げたものにも影響がでますね...
github上のhtmlの公開方法:github pagesの活用
以下を参照.簡単です.
[setting] - [GitHub Pages] - [source] : master branch に変更でsave
変更が10分くらい反映されません.
いろんなサイトにindex.htmlを作らないと駄目だよと書いてますが,無くても全然大丈夫でした.
- index.htmlありの場合 : https://[username].github.io/[repositoryname]
- index.htmlなしの場合 : https://[username].github.io/[repositoryname]/[htmlfilename]
前回の記事の内容をリンクすると,以下の感じです.
https://computational-sediment-hyd.github.io/1DBedVariationMixed/case01.html
iframeとして埋め込む方法
以下を参照.
上記サイトのとおりですが,普通に埋め込むと,
<iframe src="https://computational-sediment-hyd.github.io/1DBedVariationMixed/case01.html" width="600" height="300" ></iframe>
なので,下のようにスケールを調整.大きめのサイズで取り込んで0.6倍してます.
<div style="width:600px;height:200px;"><div style="width:1000px;"><iframe src="https://computational-sediment-hyd.github.io/1DBedVariationMixed/case01.html" frameborder="0" width="1000" height="333" style="transform:scale(0.6); transform-origin: left top;"></iframe></div></div>
もっと複雑なグラフを作ろうと思うとサーバが必要ですね.
githubの新機能GitHub Actionsがベータ版ですが公開されたようで,自動でデプロイまでやってくれるらしいので,サーバを立てるのもいいですね.