マツオソフトウェアブログマツオソフトウェアブログソフトウェア開発に関連することを発信しています2023年3月18日土曜日お名前.comのVPSでFTPを設定する話お名前.comのVPSにFTPを設定するのに非常に苦労したので解説する。21ポートを開放クライアントからVPSへアクセスするとエラーになるufwのステータスは以下。statusポートが正しく開放されているのに接続できない。途方に暮れていたが、お名前.comの設定周りをしらみつぶしに見ていたらIPセキュリティの項目を発見。Redo機能を実装する、と題して複数のポストをこちらに投稿していたのだけれど、コード表示が上手に行えなかったのでZenn.devに以下投稿した。Angular2018年3月18日日曜日グルグル回転している長方形(Rectangle)と線(Ray)の当たり判定3Dで回転しているキューブとRayの当たり判定の背後にある数式がいまいちよく分からなかったのでJavaScriptのCanvasを使って図解してみた。2Dも3Dもテストする軸(Axis)の数が変わるだけで内容は一緒。コードは以下より取得してもらいたい。JSFiddleGitHub(上に同じ)数式の背後にある考えは以下。Intersection以下図解。OriginがRayの起点になっている。directionでRayの方向を指定している。convertYUp(1)));左上のオレンジと黄色の線で囲われている領域がくるくる回転しているRectangleとなる。Originから左上のRectangleに伸びている線(Vector)はRayとRectangleの距離を算出するためのものなので、投げかけているRayとは別物なので注意してほしい。Intersection」と出る)この数式の肝はSlab(オレンジと黄色の線)とRayがいつ(Time)交わるかなので、Timeを算出しないといけない。Timeを求める式は以下。lengthOfDirectionOfRayProjectedOnYAxis;Timeを求める元々の式は以下。Directionの長さSlabの位置を求める式からTimeを求める式に変換すれば前述の式になる。Productを使用すればよい。~まとめ~同一軸上に投影すれば後は単純な長さの比較になるのでTimeが求まると理解するまで悶々と苦しんだけど、今はスッキリ。こんな投げやりな解説で伝わるかははなはだ心もとないけれど、誰かの理解の一助になれば幸い。分からないことありましたらコメントください。Math2016年11月9日水曜日async、await、CancellationTokenについて職場でasync、await、CancellationTokenの実装方法についてまとめたので同じ内容をまとめておく。DBアクセス部分はDapperを使用している。awaitについての詳細は下記のリンクを参照してもらいたい。日本語翻訳されていないので英語。下記のような状況ではWebサーバのパフォーマンス向上が見込めるので積極的に使ったほうが良い。awaitの非同期処理で知っておくべきことは「awaitされている処理も呼び出し元のThreadと同一のThreadで処理される」ということにある。awaitキーワードは呼び出されたメソッドを呼び出し元のThread上で必要に応じて適時処理するだけであり、新規にThreadを作成するわけではないからだ。Threads(詳細説明)つまりDBやファイルIOなどの別プロセスの結果待ちが発生する処理などでは非常に有用ではあるけれど、非同期処理になることを期待して単純に処理を二分しても実際には同一のThread上で二つの処理が適時行われるだけなので意味がないということ。awaitとTask.Runを組み合わせると良い。Task.RunはThreadpoolへ処理を投げるのでパフォーマンス向上が見込める。下記リンク先にある解説図を見ると一連の動きが良く分かるので是非参照してもらいたい。awaitキーワードの使い方が動作原理を含めて理解できたと思う。使い方を誤らなければ簡易な記述で容易にパフォーマンス向上が見込めるので使える状況では積極的に使っていくべきだとは思うけれど、ともすると処理フローは複雑化しやすく、関連する箇所全体で非同期処理を念頭に置いた実装にしなければならないので使いどころは慎重に見極めないといけない。非同期リクエストのクライアントからのキャンセル方法こここらは非同期リクエストをクライアントからキャンセルする方法を解説する。alert('処理を中断しました。alert('処理中にエラーが発生しました。}});ページ遷移時に非同期リクエストが処理されている場合は明示的にリクエストをabortしないとキャンセルされない。重たい処理などを実行する場合はキャンセル処理を実装しておくと不要な処理の実行を防ぐことによってパフォーマンス向上が見込めるので(エンドユーザがレスポンスを待たずにページ遷移してしまったとき用などに)積極的にキャンセル処理は実装したほうが良いだろう。2のバグで非同期処理中にAbortするとOperationCanceledExceptionが発生するのでそれを抑制する必要がある。下記コードをGlobal.asax.csに追加してほしい。Appなどで多量のAjaxリクエストを行っている最中にエンドユーザがページを離れてしまうとサーバサイドで行っている処理はすべて無意味になってしまうので、そのようなときのためにもキャンセル処理を組み込んでおくと良いだろう。ASP.NET2016年9月15日木曜日ユニットテストでlog4netのログを出力する方法いまさらな内容だけど備忘録としてユニットテストでlog4netのログを出力する方法を記しておく。constructorで下記設定を行っておけばユニットテストの結果Windowの下にログが出力される。パイチャート前回に引き続き今回もd3.jsでのチャートをまとめておく。今回はパイチャートについて。ツールチップSFiddleはこちら弧上に描画するためのarc()とパイ上に配置するためのpie()を用意する。それと配色用のcolor。d3.scale.category10();データをpie()にかませて配置用のデータへと変換する。.append('g');弧を描画する。arc);arc.centroid()を使用すると真ん中の座標が簡単に取得できる。});弧の外側に文字を描画するには三角関数を使用して座標を算出する。text-anchorを角度によって変更している。パイチャートでは90度(Math.PI/2)の位置が0度計算になっているので注意。それなのでxは-する。ツールチップ前回に引き続き今回もd3.jsでのチャートをまとめておく。今回はおもにツールチップ的なものについて。ツールチップ的な部分以外は前回のものとあまり大差ないため省略するので詳細は前回を参照してもらいたい。パイチャートJSFiddleはこちらX軸。今回はtimeを使用している。range()の指定は少しずらすために30からとなっている。.call(xAxis);ツールチップ。});オーバーレイとツールチップの表示場所の指定。チャート上のどこにマウスがあっても表示したいのでオーバーレイはチャート全体を覆っている。mousemove()の冒頭でマウスの現在座標からその位置よりも左側に位置するデータをbisector()で取得している。それだけだとマウスが二つのデータ間にある場合、必ず左側のものが選ばれてしまうのでマウスとデータ間の距離を比較してツールチップを表示するべきデータを取得している。このx.invert()の使用方法はtime()でしか使用できないので注意。linear()の場合(linear()は違うのかも。調査していないので不明)はデータの幅とrange()、マウスの座標から当該のデータを探し出す必要がある(詳細は下記参考を参照してもらいたい)。Japanウェブアプリ、デスクトップアプリ、モバイルアプリ、ゲームなどを開発しています。