月: 2023年2月

Notepad++ SSHでリモートのファイルを編集

投稿日: 投稿者:


ここで教えて頂きました。

1 プロファイルを追加

 

 

 

 

 

 

 

 

2 追加後のリスト

 

 

 

3 変更したいファイルに書き込み権限を付与

[root@xxxxxx]# chmod 666 *.php
[root@xxxxxx]# ls -l
total 40
-rw-rw-rw- 1 root root 5252 Feb  5 12:56 ___________.php
-rw-rw-rw- 1 root root 1167 Jan 27 10:26 _____________.php
-rw-rw-rw- 1 root root 2018 Feb 14 12:13 ______________.php

Tabulator セルのマウスオーバーで文字を反転表示

投稿日: 投稿者:

 

 

 

マウスが乗ったセルを反転させて強調表示させるため、組込みの関数を探してみましたが、ないようなので、StackOverFlowの投稿を参考にして、cellのformatterでエレメントにCSSのクラスを追加したり削除したりさせてみました。

< コード例 >
CSS


  /* tabulator セル文字反転用 */
  .text_reverse {
    color: white;
    background-color: black;
    
  }

Javascript


    // Airport name //
    {title: 'Name', field: 'nmAirport', width: 180,
      formatter: function (cell, formatterParams, onRendered) {

        // 反転させて強調 //
        const cellelm = cell.getElement()
        $(cellelm).on("mouseover", function (e) {
          $(this).addClass("text_reverse")

        })
        $(cellelm).on("mouseout", function (e) {
          $(this).removeClass("text_reverse")
        })
        return cell.getData().nmAirport

      }

    },

< 画面例 >

 

 

 

 

 

画像には枠をつけてみました。

 

 

 

 

 



  /* tabulator 画像セル背景反転用 */
  .imgback_reverse {
    background-color: #B8E2E6;
    border: 1px solid #00a0a0;
  }

Color Thief で画像のドミナントカラーを検出

投稿日: 投稿者:

Google chart API のバーの色をロゴ画像のドミナントカラーにしたいので、画像からドミナントカラーを検出するライブラリを探してましたところ、Color Thiefで出来るので使ってみました。
ここで教えて頂きました。

< コード例 >

ライブラリはCDNから読み込んでます。


<!-- Color Thief -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/color-thief/2.3.0/color-thief.umd.js"></script>

画像エレメントをColor Thiefで指定させるため、画像にidをつけます。


// ++ 行走査 ++ //
      $.each(rows, function (i, itm) {

        // エアラインロゴ画像にidをつける //
        td = $("#" + itm["id"]).children("td").eq(2)
        $(td).children("img").eq(0).attr("id", "alimg_" + i)

        == 省略 ==
})

Color Thiefで検出


// サイズが小さいとエラーなのでデフォルトをセットして例外で囲む //
      let color = [0, 0, 255]
      try {

        // ロゴのドミナントカラーを検出 //
        const img = document.querySelector('#alimg_' + i);
        color = colorThief.getColor(img);
        console.log(color)

      }
      catch (e) {
        //console.log(e)
      }

RGB値をhexのカラーコードに変換 (公式サイトのFAQにありました)


// RGBカラー配列Hex文字列変換 //
    const rgbToHex = (r, g, b) => '#' + [r, g, b].map(x => {
        const hex = x.toString(16)
        return hex.length === 1 ? '0' + hex : hex
      }).join('')

変換結果 (開発ツールのconsole)


DOWTABLE_BC1_0620_0820
(3) [27, 58, 138]
DOWTABLE_NH239_0625_0830
(3) [12, 51, 139]
DOWTABLE_7G41_0640_0845
(3) [44, 44, 44]
DOWTABLE_JL305_0700_0905
(3) [203, 4, 4]
DOWTABLE_NH241_0725_0930
(3) [12, 51, 139]
DOWTABLE_BC3_0730_0940
(3) [27, 58, 138]
DOWTABLE_JL307_0800_1005
(3) [203, 4, 4]
DOWTABLE_NH243_0830_1030
(3) [12, 51, 139]

< 画面例 >

羽田=>福岡の週間フライトスケジュール

 

Googleのタイムラインチャートで表示
JAL, ANA, SkyMark, StarFlyer で色分けされたバーになります。

[商品価格に関しましては、リンクが作成された時点と現時点で情報が変更されている場合がございます。]

天草エアラインの奇跡。 （集英社文庫(日本)） [ 鳥海 高太朗 ]
価格：572円（税込、送料無料) (2023/2/14時点)

楽天で購入

 

 
[商品価格に関しましては、リンクが作成された時点と現時点で情報が変更されている場合がございます。]

航空情報増刊 世界航空機年鑑 2022-2023 2023年 3月号 [雑誌]
価格：7700円（税込、送料無料) (2023/2/14時点)

楽天で購入

 

 
[商品価格に関しましては、リンクが作成された時点と現時点で情報が変更されている場合がございます。]

【全部揃ってます!!】日本のエアライン4 [全8種セット(フルコンプ)]【 ネコポス不可 】
価格：5984円（税込、送料別) (2023/2/16時点)

楽天で購入

 

 

Leaflet Javascript 地図内に画像を配置

投稿日: 投稿者:

HTMLで地図を配置したdiv内に画像用divを配置して、CSSで画像用divの位置をセットします。

< コード例 >
HTML
#livemap_photoのsrcはJavascriptでダイナミカリーにセットしています。

<!-- Leaflet伸縮地図 -->
<div id="livemap-container" class="z-depth-1-half map-container p-0">
<!-- 省略 -->
<!-- Planespotter 機材写真 -->
    <figure>
        <div id="livemap_photo_div" class="dsp_none">
            <a id="livemap_photo_a" href="" target="_blank">
                <img id="livemap_photo" src="" width="240" class="border border-primary rounded fade-in"></img>
            </a>
            <figcaption id="livemap_photo_figcap" class="flagcap_dark">..</figcaption>

        </div>
    </figure>
</div>

CSS

positionを absoluteにする
bootom, top, left. right で地図内でのパッディングをセットする
z-indexを地図より大きくする

/* ライブ地図機材写真 */
#livemap_photo_div {
    position: absolute;
    bottom: 8px;
    left: 8px;
    z-index: 99999;
    color: white;
    font-size: 14px;
    opacity: 0.8
}

< 画面例 >

リリースニュース 実用的スカイスキャナー

投稿日: 投稿者:

実用的な航空券予約サイトです。
検索はBestとAllが選べます。

< URL >

https://mapflight.net/Airport2/

データはスカイスキャナーと同じですが、以下の特長があります。

< 特長 >

1 余計な広告が少なくストレスなく使える
2 メニュー、結果がコンパクトにまとめられていて実用的
3 発着空港を地図で確認出来る
4 飛行経路を地図で確認出来る
5 乗継空港を地図で確認出来る
6 観光地の写真で楽しめる
7 飛行機の機種がわかる
8 推定される機材番号の飛行機写真がポップアップする
9 近くの空港が地図で選べる

リンドバーグ・プロパガンダ

投稿日: 投稿者:

In time of war, truth is always replaced by propaganda.
戦時中は、真実はプロパガンダによって常に置き換えられる。