西原春夫・地震自己責任

『 地震そのものは、人の力では阻止できない。従って、地震に不可避に伴う結果については、だれを非難することもできないだろう。冷たい言葉で言えば、自己責任に帰せられる災害、運命とあきらめなければならない部分が人生にあることは認めざるを得ない。 』

Python 基本メモ メール送信

< コード例 >

## 完了メール配信 ##

TO_ADDRS = ["????????@gmail.com", "???????@?????.co.jp"]


smtp_server = "???????"
port = ??
server = smtplib.SMTP(smtp_server, port)
server.set_debuglevel(True)

message = MIMEMultipart()
message["Subject"] = "@@ タイトル @@"
message["To"] =  ",".join(TO_ADDRS )

message["From"] = "??????"

text = MIMEText("本文")
message.attach(text)

server.send_message(message)
server.quit()

chart.js 再描画でのエラーを回避


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

< コード例 >

チャートは4個を同時に表示
chart.jsの描画はクラスで行ってます。
4個のチャートオブジェクトは、staticな配列に入れてます。


static charts = [null, null, null, null] 

   // 前回消去 //
    if (typeof PieChart.charts[this.idx] !== 'undefined' &&  PieChart.charts[this.idx] !== null && PieChart.charts[this.idx]) {
      PieChart.charts[this.idx].destroy();
    }


    // == ドーナツチャート描画 == //
    PieChart.charts[this.idx] = new Chart(context, {
      //type: 'doughnut',
      //type: 'pie',
      type: chartType,
      data: {
        labels: labels,
        datasets: [{
            label: name,
            backgroundColor: ["#fa8072", "#00ff7f", "#00bfff", "#a9a9a9", "#f5f5f5", "#a7d4d4", "#E5E100"],
            data: counts
          }]
      },

      // プラグインをセット //
      plugins: [
        ChartDataLabels
      ],

      //color: "#ffffff",
      options: {
        responsive: false,
        maintainAspectRatio: false, // 2回目以降大きくなってしまうのを防止用

        legend: {
          labels: {
            // グローバルプロパティを上書 ?????? no affect //
            fontColor: 'white'
          }
        },

        // データラベルがアフェクトする用 //
        /*toltip: {
         enabled: false
         },*/

        plugins: {

          // データラベルがアフェクトする用 //
          toltip: {
            enabled: false
          },

          title: {
            display: true,
            text: name
          },

          // == データラベルプラグインの設定 == //
          datalabels: {
            color: '#294829',
            font: {
              weight: 'bold',
              size: 10, // <=== 小さ目
            },
            formatter: (value, ctx) => {

              let label = ctx.chart.data.labels[ctx.dataIndex];
              //return label + '\n' + value + '%';
              return label
            }
          }
          // == データラベルプラグインの設定終わり == //

        }
      }
    })

Tabulator カラムのグループヘッダー

 

 

 

ドキュメントはここ

< コード例 >

グループ化したいタイトルのカラムの配列を入れ子にします。


      // == Sizes == //
      {
        title: "Sizes",
        columns: [
          // GB Size //
          {title: 'Size (GB)', field: 'GB_SIZE', width: 50, hozAlign: 'right',
            formatter: function (cell, formatterParams, onRendered) {
              return numeral(cell.getValue()).format("#,###")
            }
          },

          // GB 前日//
          {title: 'Size (GB) P', field: 'GB_SIZE_BF1', width: 50, hozAlign: 'right',
            formatter: function (cell, formatterParams, onRendered) {
              return numeral(cell.getValue()).format("#,###")
            }
          },

          // MB Diff from 1 day before //
          {title: 'DiffS', field: 'DIFF_MB_SIZE', width: 60, hozAlign: 'right',
            formatter: function (cell, formatterParams, onRendered) {
              return numeral(cell.getValue()).format("#,###")
            }
          },
        ]
      },

      // == Counts == //
      {
        title: "Counts",
        columns: [

          // File count //
          {title: 'Count', field: 'CNT_FILE', width: 70, hozAlign: 'right',
            formatter: function (cell, formatterParams, onRendered) {
              return numeral(cell.getValue()).format("#,###")
            }
          },
          // File count previous //
          {title: 'Count P', field: 'CNT_FILE_BF1', width: 70, hozAlign: 'right',
            formatter: function (cell, formatterParams, onRendered) {
              return numeral(cell.getValue()).format("#,###")
            }
          },

          // File count difference from previous date //
          {title: 'DiffC', field: 'DIFF_CNT_FILE', width: 60, hozAlign: 'right',
            formatter: function (cell, formatterParams, onRendered) {
              return numeral(cell.getValue()).format("#,###")
            }
          }
        ]
      },

< 画面例 >

Leaflet Javascript AlmostOver でポリラインのイベント

Leaflet Javascriptで、GeoJSONから読み込んだポリラインに対してイベントをつける必要があり、
mouseover, mouseoutのイベントが発火しにくいので、調べてましたところ AlmostOver のプラグインで解決しました。

< コード例 >

HTML


<!-- Leaflet almostover -->
<script type="text/javascript" src="Script/js/leaflet.almostover.js"></script>

Javascript


        // almost over //
        lmap.almostOver.addLayer(DrawLine.amlinejson);

        // @@ 線をクリックした時 @@ //
        lmap.on('almost:click', function (e) {
         
         if (DrawLine.thickLines) {
         lmap.removeLayer(DrawLine.thickLines)
         }
         // if (RailLines.stationsjson) {
         //   lmap.removeLayer(RailLines.stationsjson)
         // }
         
         
         //console.log("--- e.target")
         //console.log(e.target)
         
         const layer = e.layer
         const pp = layer.feature.properties
         
         // 線を太くする //
         const tgtjson = new getComlineJSON(datas, pp.NAME)
         //console.log(tgtjson)
         
         DrawLine.thickLines = L.geoJson(tgtjson, {
         
         // スタイル //
         style: {color: "#00FFFF", weight: 7}
         
         }).addTo(lmap)
         
         //const comline = pp.NM_COM + " " + pp.NM_LINE
         //$("#raillinespn").text(comline)
         
         // リクエスト引数リスト名 //
         //const listnm = "国交 " + pp.NM_COM + " " + pp.NM_LINE
         //alert(listnm)
         
         // 駅簡略化マーカー描画 //
         //const rl = new RailLines()
         //rl.getStationsMarker(listnm)
         
         });

< 画面例 >

マウスが乗った線を太くする