ニコニコ大百科:グラフ機能(サポートページ)

ニコニコ大百科:グラフ機能(サポートページ)とは、ニコニコ大百科:グラフ機能の子記事です。

使用上の注意

• ニコニコ大百科は株式会社ドワンゴの登録商標ですが、ニコニコ大百科:グラフ機能の開発に株式会社ドワンゴは関与しておりません。
• 本機能及び生成されたHTMLの使用は自己責任となります。ニコニコ大百科運営(そもそも開発に関与していない)・ニコニコ大百科:グラフ機能の開発者は一切の責任を負いません。
• 将来、ブラウザの仕様変更などによりレイアウトが崩れる可能性は低いですがなくはないです。表示が崩れていないか時々は確認して下さい。
• ニコニコ大百科がsvgタグに対応した暁には、同タグを用いて描き直しをお願いいたします。(canvasはJavaScriptも許可しないといけないから対応する日は来ないでしょう。)
• JavaScript部分はKotlin/JS 1.6.10で開発しています。
• 本機能の仕様は予告なく変更することがあります。

ダウンロード版(サポート終了)

• サポートが終了したダウンロード版は こちら(ただし約110kBあります)。
• ダウンロード版のKotlin/JSのトランスパイル前ソースコードは こちら。

更新情報

下に行くほど古い。括弧内はバージョン番号。

• 2022/4/1(2.0.0): ニコニコ大百科:円グラフ機能導入。未完成の機能がイースターエッグ的に混じっていたりしてベータ版に近い。
• 2021/4/1(1.4.0): Anniversary Update(笑) 枠とx軸を非表示にする機能と、枠のサイズを変更する機能を実装。
• 2020/10/31(1.3.0): 文字列挿入機能追加。クリップボードのコピーボタンの設置。データ数が増えた時に変換に時間がかかる問題の改善。色指定で空白文字列をtranparentと解釈するように変更。
• 2020/4/25(1.2.1): 小数点以下の扱いを修正。
• 2020/4/24(1.2.0): 途中で線の太さを変更できるようになりました。
• 2020/4/8(1.1.1): 線を太くすると上にずれるバグの修正。transparentな線分の描画の廃止。レスポンシブデザインに多少対応(笑)
• 2020/4/3(1.1.0): 色の指定制限を修正。ゲームアツマールへの広告ありがとうございます。
• 2020/4/1(1.0.0): リリース。
• 2020/3/27: 製作開始。

報告先

解決策・改善案を思いつかれた方は掲示板までお知らせ下さい。ただし、以下の点については掲示板投稿前に予めご検討をお願いいたします。

• ブラウザによって表示が変わらないか: Chromeだけで問題が発生したケースがありました。なお、IE11でテストする時はHTMLヘッダーに<meta http-equiv="X-UA-Compatible" content="IE=edge">が必要になります。
• ブラウザのズーム倍率の設定によって表示が変わらないか: 通常倍率では正常に表示されていても、縮小・拡大で要素間の隙間や外周の段差・にじみなどが生じることが多かったです。
• 角度によって不具合が生じないか: 境界線の角度が水平または垂直に近い時に隙間ができるケースがありました。
• 色によって不具合が生じないか: たとえば円グラフ機能では、赤と黄色が隣接すると黄色側に色がにじむケースがありました。
• 既出でないか: 掲示板や別記の博物館をご確認下さい。

検証の手引き

小数点以下の処理によるピクセル単位のズレについて、以下のようなことが影響を与えることがあるようです。

• OS、ブラウザおよび、それらのバージョン
• フォントサイズ?
• Windowsの場合、「ディスプレイ設定」の「拡大縮小とレイアウト」の倍率。
• ブラウザのズーム倍率。
  • Firefoxの場合、ctrl + "+", "-"で倍率を変更した場合とctrl + マウスホイールスクロールで変更した場合で、設定できる倍率が異なります。
  • Firefoxで上記2つのズーム倍率変更を組み合わせると、単独では指定できない倍率が指定できるます。
  • Firefoxで上記2つのズーム倍率変更を組み合わせた時、アドレスバーに同じ倍率で表示されても実際にはわずかに表示が異なる場合があります。
• デスクトップモード, タブレットモード(URLで設定する場合やモバイルブラウザのデスクトップ型表示オプション)
• モバイルだと画面の縦・横(おそらくWindow.devicePixelRatioの影響?)
• 印刷モード
• 以上の組み合わせ

他の画像挿入機能との違い

	お絵カキコ	アップロード	グラフ機能
正確な作図	×	○	○
非個人依存	○	×	○
簡潔なHTML	○	○	×

ニコニコ大百科で画像の利用といえばお絵カキコが定番ですが、マウスで描くため手書きの大雑把な図になってしまいやすいです。

これを解消する方法としては、別のソフトで正確な画像を作成した後、ニコニコ静画やニコニコモンズ、(動画に変換して)ニコニコ動画などにアップロードし、サムネイルを記事で使用するという方法が知られていますが、この方法では画像を提供した本人が静画もしくは動画を削除した(あるいはBANなどにより削除された)時に、記事内の画像まで一緒に失われてしまうという問題があります。

ニコニコ大百科:グラフ機能では、適切なデータさえ用意できれば正確な図形を描くことができ、しかもその図形は大百科外部への参照ではなく記事の一部として保存されるので、図形の作成者が引退することがあっても図形自体は記事と共に存続することが保証されます。

また、修正の必要が生じた時、お絵カキコやアップロード画像の作成方法によっては最初から描き直さなければならない場合もありますが、ニコニコ大百科:グラフ機能の場合は元のデータが残っていればデータを元にした再描画が容易です。

一方でニコニコ大百科:グラフ機能で作成された図形のHTMLソースは非常に長いものとなり、HTMLエディタを無効にしてHTMLソースを直接編集しようとすると、グラフ以外の記事の部分でも編集したい箇所を探すのが手間になります。編集したい箇所の単語・文節を適宜「ページ内を検索」などで検索してジャンプすると、探す手間が削減できると思います。

ニコニコ大百科:グラフ機能自体は開発者個人に依存しているとも言えますが、生成されたHTMLから作られた記事が個人に依存しないのは先述の通りです。そもそも、ダウンロード版のソースコードを通じてコア機能の部分は公開されているのでニコニコ大百科:グラフ機能の個人への依存度はかなり低いと言えます。

Q&A

言われそうなことを中心に。

HTMLソース出力末尾にこの記事への誘導があって宣伝乙なんですが

この記事へのリファレンスを入れることは、バージョン1.0公開前から考えたことはありましたが、上記ような批判が想定されるため自重しておりました。

しかしながら、この機能で作成したグラフに不具合が発生しないと確認することは極めて難しいということを思い知ったため、機能が複雑化したことを機に、不具合をこの記事及び関連記事で集中的に管理することができる方向に仕様変更しました。逆に言うとグラフ機能を使用して作られた記事やユーザー記事でのサポートは行わない予定です。

自己顕示欲丸出しで許せないという考えの方には、noSourceなどのオプションを提供しておりますのでご利用下さい。ただし不具合が発生しても、気づいた読者がこの記事で報告する経路がなくなれば、こちらが知る手段もなくなるということはご理解下さい(できる限り対応したいとは考えていますが、対応は自分の「義務」でないことは申し添えておきます)。

誰も使っていない…涙拭けよ

自分で使うために作ったものをせっかくだからと公開しているに過ぎないので、それほど気にしません。

• 需要としては、そもそもグラフを使用したほうが良さそうな記事自体が少ない。
• 少し考えてみたが、グラフを使用して記事を書いた方が良さそうな題材はなかなか思いつかない。
• 題材があっても、データ生成までして記事を書くほどのマメな編集者は絶滅している。

といったことにより、自分以外に使用者がいなかったとしても想定の範囲内です。むしろ使う人が増えてメンテナスの手間が増えると都合がわ(ry

別の所にも書きましたが、編集者にお絵カキコ以外に選択肢が存在することが大事かなと。

簡単なことは簡単でなければならない。難しいことは少なくとも可能でなければならない。

by Perlの開発者

ゲームアツマールの拍手やプレゼント乞食のポップアップがうざい

ゲームアツマールではユーザーに拍手やプレゼントを促すポップアップが出るようになったのですが、あのポップアップはアクションゲーム中やタイムアタック中でも出現する上に、2022年3月現在なんとゲーム投稿者でも止めることができません。最近のゲームアツマールのこういった動向には末期的なものを感じます。

じゃあ、ゲームアツマールが終了したら巻き添えで終了?

ですが、たとえゲームアツマールが終了してもダウンロード版への転向は可能です。本体記事掲示板>>1以外の誰も知らないかも知れませんが、そもそも初版はHTMLをローカルに保存してブラウザで開くダウンロード版でした。

ニコ百がSVG対応したら意味なくなるんじゃ…

そうなれば、このソフトウェアのメンテをしなくて良くなるので助かります。この記事が問題提起したことによって仕様変更が起こせたものと勝手に思うことにします。

IEは推奨環境に入っていませんが、IEのMicrosoftサポート期限が(ベースにしているソフトウェアの方針に影響を与えて)SVG採用の契機になるかもと、ちょっと思っています。

当グラフ機能側でも何年か先にはSVGに出力する機能が実装される…かもしれません。

ソース公開はGitHubでやれ

ごもっともですが、幸い大百科にソースコードのシンタックスハイライトをつけたまま貼り付けることは可能ですし、GitHubでの公開は予定しておりません。KotlinでFizzBuzzをGitHubでやらなかったことが一つの方向付けになったことは否定しません。

機能の複雑化に伴い、単一ファイルにまとめることが難しくなったことから、ソースコードの公開は予定しておりません。ご要望などあれば検討したいと思います。

使いにくい

グラフの性質上、情報を正確に記述する必要があるわけですが、情報の圧縮に限界がある以上、最低限の記述分量というものが存在します。グラフ機能が要求するのは必要最低限の情報量にかなり近いと思います。これ以上は入力データが冗長になることと引き換えで、冗長な方が使いやすいかどうかは好みの範疇だと思います。

GUIで入力データが作れないということを理由に挙げる方もいるかと思いますが、GUIというのは想定するべき操作の可能性が爆発的に増えるので、一般に開発難易度が高いとされています(プログラミング言語仕様でGUIが標準化されているものが少ないことはその帰結と言えるでしょう)。従ってGUIで操作できるようなお手軽なものを作る予定はありません。

GUIによるデータの生成はExcelなどのご利用をご検討下さい。

お絵カキコや静画でいいのでは?

上記で既出です。

記事乱立すんなし

記事が長くなると変更箇所を探すのに非常に苦労しますし、リファレンスとして読む方も必要箇所を探すのが大変になると思います。

編集履歴をたどるとわかりますが、バージョン2.0.0より前は過去リビジョンなどを活用し記事数を抑えるためにかなり無理すらしています。

今ある記事以外にニコニコ大百科:グラフ機能(コマンド一覧)、ニコニコ大百科:グラフ機能(サンプル集)、ニコニコ大百科:グラフ機能(サポートページ)くらいは必要だと思いますし、2022年5月以降に順次分割は進めていく予定です。

関連項目

• ニコニコ大百科:グラフ機能