【Hugo#1】Hugoとは～クイックスタート
DeepLを用いて翻訳しただけです。
https://gohugo.io/
[目次]
Hugoとは
推奨対象
クイックスタート
Step1: Hugoのインストール
brew install hugo # or port install hugo
新しいインストールを確認するために
hugo version
Step2: 新規サイトの作成
hugo new site quickstart
上記では、新しいHugoサイトをquickstartというフォルダに作成します。
Step3: テーマの追加
検討すべきテーマのリストはComplete List | Hugo Themesをご覧ください。このクイックスタートでは、美しい Ananke テーマを使用します。
まず、GitHubからテーマをダウンロードして、サイトのthemesディレクトリに追加します。
cd quickstart git init git submodule add https://github.com/theNewDynamic/gohugo-theme-ananke.git themes/ananke
git を使用していない方への注意。
- gitがインストールされていない場合は、このテーマの最新版のアーカイブを本サイトからダウンロードできます
- .zipファイルを解凍して、「gohugo-theme-ananke-master」ディレクトリを作成します。
- ディレクトリを "ananke "にリネームして、"themes/"ディレクトリに移動してください。
そして、テーマをサイト構成に追加します。
echo theme = \"ananke\" >> config.toml
Step4: コンテンツの追加
手動でコンテンツファイルを作成し（例：content/
hugo new posts/my-first-post.md
新たに作成したコンテンツファイルを必要に応じて編集すると、次のような内容で始まります。
--- title: "My First Post" date: 2019-03-26T08:47:11+01:00 draft: true ---
下書きはデプロイされません。投稿を終えたら、投稿のヘッダーを更新して、draft: falseとしてください。詳しくはこちらをご覧ください。
Step 5: Hugoサーバの起動
では、ドラフトを有効にした状態でHugoサーバーを起動します。
▶ hugo server -D
| EN
+------------------+----+
Pages | 10
Paginator pages | 0
Non-page files | 0
Static files | 3
Processed images | 0
Aliases | 1
Sitemaps | 1
Cleaned | 0
Total in 11 ms
Watching for changes in /Users/bep/quickstart/{content,data,layouts,static,themes}
Watching for config changes in /Users/bep/quickstart/config.toml
Environment: "development"
Serving pages from memory
Running in Fast Render Mode. For full rebuilds on change: hugo server --disableFastRender
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Press Ctrl+C to stophttp://localhost:1313/ の新しいサイトにアクセスしてください。
自由に編集したり、新しいコンテンツを追加したりして、ブラウザを更新するだけですぐに変更を確認できます（ウェブブラウザで強制的に更新する必要があるかもしれませんが、通常はCtrl-Rなどが有効です）。
Step 6:テーマのカスタマイズ
新しいサイトはすでに素晴らしいものになっていますが、公開する前に少し手を加えてみましょう。
〇サイト構成
テキストエディターでconfig.tomlを開きます。
baseURL = "https://example.org/" languageCode = "en-us" title = "My New Hugo Site" theme = "ananke"
上のタイトルをもっと個人的なものに置き換えてください。また、すでにドメインを用意している場合は、baseURLを設定します。なお、この値は、ローカルの開発サーバーを実行する際には必要ありません。
ヒント：Hugoサーバーの稼働中にサイト構成やその他のファイルを変更すると、キャッシュをクリアする必要があるかもしれませんが、すぐにブラウザで変更を確認することができます。
テーマ固有の設定オプションについては、テーマサイトをご覧ください。
さらにテーマをカスタマイズするには、テーマのカスタマイズをご覧ください。
Step 7:静的ページの構築
これは簡単です。呼び出すだけです。
hugo -D
デフォルトでは、./public/ディレクトリに出力されます（-d/--destinationフラグで変更するか、設定ファイルでpublishdirを設定してください）。
【Python#10】室内の温湿度データ読み込み＆時系列グラフ作成
前回は以下の記事で，室内の温湿度をDHT11というセンサを用いて計測し，ArduinoとPC間のシリアル通信を用いてデータを飛ばし，Pythonでcsvファイルに保存させることを達成した。
opuktr.hatenablog.com
今回はその保存したcsvファイルからデータを読み込み，グラフで表示させることを試みる。
表示の仕様としては，以下を考える。
- csvファイルから温湿度データ読み込み
- 温湿度データを時系列データとしてグラフ表示
[目次]
1. 必要素子（今回はなし）
今回はArduinoを使用していない為，無しとする。
2. 配線図（今回はなし）
今回はArduinoを使用していない為，無しとする。
3. Pythonコード
●Python側
# -*- coding: utf-8 -*- import datetime import pandas as pd import numpy as np import matplotlib.pyplot as plt #変数の初期化 temp = [] humid = [] time = [] hi = [] length = [0] l=0 #基準となる日時の指定 standard = datetime.datetime(2018,8,18,23,0,0) #2018/8/18 23:00:00を基準 for i in range(24): #24時間分のデータ読み込み #ファイル名の指定 filename = "temphumid_" + standard.strftime("%Y%m%d") + "_" + standard.strftime("%H") + ".csv" #datafram型として読み込み lstpd = pd.read_csv(filename,engine='python') #1つの変数に格納 temp.append(lstpd["temp[℃]"]) humid.append(lstpd["humid[%]"]) hi.append(lstpd["heat index"]) #x軸のラベル取得 l = l + len(lstpd) length.append(l) time.append(standard.strftime("%H:%M")) #次の1時間に日時を変更 standard = standard + datetime.timedelta(hours=1) time.append(standard.strftime("%H:%M")) #x軸のラベル取得 #データを時系列に連結＆リスト化＆Numpy配列に変換 temp = np.array(pd.concat(temp).values.tolist()) humid = np.array(pd.concat(humid).values.tolist()) hi = np.array(pd.concat(hi).values.tolist()) #グラフの作成 fig, ax1 = plt.subplots() #温度 ax1.plot(temp,'C0',label="temp[℃]") #湿度/不快指数 ax2 = ax1.twinx() # 2軸目の設定 ax2.plot(humid,'C1',label="humid[%]") ax2.plot(hi,'C2',label="heat index") #凡例の設定 h1, l1 = ax1.get_legend_handles_labels() h2, l2 = ax2.get_legend_handles_labels() ax1.legend(h1+h2, l1+l2, bbox_to_anchor=(0, 1.02, 1, .102), ncol=3,mode="expand", borderaxespad=0) #y軸ラベルの設定 ax1.set_xlabel("time") ax1.set_ylabel("temp[℃]") ax1.grid(True) #補助線 ax2.set_ylabel("humid[%], heat index") #x軸ラベルの設定 ax1.set_xticks(length) ax1.set_xticklabels(time, rotation=90, fontsize='small') #表示 plt.show()
4. 実行結果
上図に室内の温湿度・不快指数を可視化した。
この図から
- 夜と昼の温度差は約5℃
- 8～9時頃から温度上昇が始まる
- 室温が上がると湿度が下がる
- 10～11時頃のピークはDHT11に直射日光が...笑
- 18～22時頃まで温度が下がる
ということが読み取れる。
温度の分析を行うにあたっては，分解能が1℃単位というのは非常に粗い精度なので，もう少し細かい単位で扱えるようになるのが望ましい。
今1か所だけで，かつ有線で計測を行っている状態なので，これを複数個所かつ無線でデータを集めれるようなシステムを構築したい。ここからが，大変そうだ。
【Arduino/Python#9】室内の温湿度計測&csvファイルに保存
前回は以下の記事で，室内の温湿度をDHT11というセンサを用いて計測し，ArduinoとPC間のシリアル通信を用いてデータを飛ばし，Pythonでデータを表示させるということを達成した。
opuktr.hatenablog.com
データを取得したならば，保存して置けば解析や予測等ができるようになるので，今回はPythonに飛ばしてきたデータをリアルタイムでcsvに保存することに試みる。
保存の仕様としては，以下を考える。
- 1時間毎にファイル名を変更して，csvファイルに保存
- 測定データは5秒の温度・湿度・不快指数を保存
[目次]
1. 必要素子（前回【Arduino/Python#8】と同様）
- ブレッドボード
- 抵抗(10kΩ)
- 温湿度センサ(DHT11)
- ジャンパー線 4本
ここで，今回購入したStater KitにはDHT11が基板にはんだ付けされていた。
以下にDHT11単体で使用する場合と基板に接続されている場合の比較を示す。
これを参考に自身の持つDHT11に応じて配線を変更してほしい。
＜DHT11端子の説明＞
- VDD ：電源接続（図(b)Bに接続）
- DATA ：データの読み取り（図(b)Aに接続）
- NC ：何も接続しない or 電源/グランドに直接接続（図(b)Bに接続）
- GND ：グランド（図(b)Cに接続）
3. スケッチ/Pythonコード
●スケッチ(Arduino側)
#include "DHT.h" //ライブラリ読み込み const int DHTPIN=7; //7番pinをDHTpinに設定 #define DHTTYPE DHT11 // DHTの種類をDHT 11に設定 DHT dht(DHTPIN, DHTTYPE);//DHT11に関する情報を入力 void setup() { Serial.begin(9600); //9600bpsでシリアルポートを開く dht.begin(); //DHT11による計測開始 } void loop() { delay(5000); //5秒ごとに計測 float h = dht.readHumidity(); // 湿度を測定 float t = dht.readTemperature(); // 温度を摂氏で測定 // 読み込み失敗かどうか判断 if (isnan(h) || isnan(t)) { Serial.println("Failed to read from DHT sensor!"); return; } Serial.println(t); //改行しながら温度を出力 Serial.println(h); //改行しながら湿度を出力 }
●Python側
# -*- coding: utf-8 -*- import csv import serial import datetime i = 0 #カウント用 ser = serial.Serial("COM3") # Arduinoが接続されているCOMポートを指定 while (i !=24): #24時間分計測＆保存(1時間×24回) #ファイル名の設定 now = datetime.datetime.today() #現在時刻取得 hourstr = "_" + now.strftime("%H") #時刻を文字列化 filename = "temphumid_" + now.strftime("%Y%m%d") + hourstr + ".csv" hourstr_ser = hourstr #hourstr_serの初期化 #csvファイルに書き込み with open(filename,'a',newline='') as f: #csvファイルの生成 writer = csv.writer(f) writer.writerow(["year","month","day","hour","minute","second","temp[℃]","humid[%]","heat index"]) #1行目：見出し while(hourstr == hourstr_ser): #1時間データを書き込む #情報の取得 temp = float(ser.readline().rstrip().decode(encoding='utf-8')) #温度 humid = float(ser.readline().rstrip().decode(encoding='utf-8')) #湿度 hi = 0.8*temp +0.01*humid*(0.99*temp-14.3)+46.3; #不快指数 now_ser = datetime.datetime.today() #現在時刻 #[年，月，日，時，分，秒，温度，湿度，不快指数] data = [now_ser.year,now_ser.month,now_ser.day,now_ser.hour, now_ser.minute,now_ser.second,temp,humid,hi] hourstr_ser = "_" + now_ser.strftime("%H") #時刻を文字列化 #データの書き込み writer.writerow(data) #1行目以降：データ #表示 print('--------------------------------') print(now_ser.strftime("%Y/%m/%d %H:%M:%S")) print("温度：{:.2f}℃".format(temp)) print("湿度：{:.2f}%".format(humid)) print("不快指数：{:.2f}".format(hi)) print("Wtite in {:}".format(filename)) i+=1 ser.close() #ポートを閉じる print("End")
4. 実行結果
上図のように1時間毎にファイル名が更新され，別のファイルに保存されていることが確認できる。
今回は1時間毎に保存するプログラムとしたが，6時間毎や1日毎に保存するプログラムに書き換えることも可能だろう。
これについては，随時必要な時に更新することとする。
【Arduino/Python#8】室内の温湿度計測&PCリアルタイム表示
今回は室内の温度・湿度をDHT11を用いて計測し，シリアル通信を用いてPCに取り込み，Pythonでデータを表示させるということをする。
1. 必要素子
- ブレッドボード
- 抵抗(10kΩ)
- 温湿度センサ(DHT11)
- ジャンパー線 4本
ここで，今回購入したStater KitにはDHT11が基板にはんだ付けされていた。
以下にDHT11単体で使用する場合と基板に接続されている場合の比較を示す。
これを参考に自身の持つDHT11に応じて配線を変更してほしい。
＜DHT11端子の説明＞
- VDD ：電源接続（図(b)Bに接続）
- DATA ：データの読み取り（図(b)Aに接続）
- NC ：何も接続しない or 電源/グランドに直接接続（図(b)Bに接続）
- GND ：グランド（図(b)Cに接続）
2. 配線図
3. スケッチ/Pythonコード
●スケッチ(Arduino側)
#include "DHT.h" //ライブラリ読み込み const int DHTPIN=7; //7番pinをDHTpinに設定 #define DHTTYPE DHT11 // DHTの種類をDHT 11に設定 DHT dht(DHTPIN, DHTTYPE);//DHT11に関する情報を入力 void setup() { Serial.begin(9600); //9600bpsでシリアルポートを開く dht.begin(); //DHT11による計測開始 } void loop() { delay(6000); //6秒ごとに計測 float h = dht.readHumidity(); // 湿度を測定 float t = dht.readTemperature(); // 温度を摂氏で測定 // 読み込み失敗かどうか判断 if (isnan(h) || isnan(t)) { Serial.println("Failed to read from DHT sensor!"); return; } Serial.println(t); //改行しながら温度を出力 Serial.println(h); //改行しながら湿度を出力 }
"DHT.h"ライブラリのインストールについては以下を参照。
opuktr.hatenablog.com
●Python側
# -*- coding: utf-8 -*- import numpy as np import serial import datetime def queue(src, data): #「要素番号が若い＝古いデータ」となるよう格納する関数 dst = np.roll(src, -1) #配列の要素を回転[backward] dst[-1] = data #配列の最後にデータを格納 return dst # 1次元配列の生成 temps = [0]*100 #温度の配列 humids = [0]*100 #湿度の配列 i = 0 #カウント用変数 ser = serial.Serial("COM3") # Arduinoが接続されているCOMポートを指定 while(i != 100):#10分間(6秒×100回)のデータを表示 #情報の取得 temp = float(ser.readline().rstrip().decode(encoding='utf-8')) #温度に関して humid = float(ser.readline().rstrip().decode(encoding='utf-8')) #湿度に関して now = datetime.datetime.today() #現在時刻に関して #表示 print('--------------------------------') print(now.strftime("%Y/%m/%d %H:%M:%S")) print("温度：{:.2f}℃".format(temp)) print("湿度：{:.2f}%".format(humid)) # キュー操作により温湿度データの格納 temps = queue(temps, temp) humids = queue(humids, humid) i+=1 ser.close() #ポートを閉じる print("End")
ここでは，Pyserialというモジュールが必要だ。なければ，"No module named serial"というエラーを吐く。
すなわち，コマンドプロンプトを開いて以下の様にする必要がある。
pip install pyserial
＜注意事項＞
- 「serial」ではなくて，「Pyserial」が必要。
すなわち，以下のコマンドは間違い。
pip install serial #Pyserialをインストールするものではない！！
「serial」をインストールしてしまったら，pipのインストール先（私の場合，C:\ProgramData\Anaconda3\Lib\site-packages）で「serial」というファイルが作成される。
「pyserial」をインストールしても，同様にpipのインストール先で「serial」というファイルが作成される。
即ち，同じファイルの中で2つが競合して上手いこと行かないことがあるので，以下のように2つともアンインストールし直して「Pyserial」だけをインストールし直すのが良い。
pip uninstall serial pip uninstall pyserial pip install pyserial
そして，Pythonを一度閉じて再度開いた方がいいかもね。
- 自分で書いたPythonのコードの名前を「serial.py」にしない。
これも同様で，モジュールが上手くインポートできずに，'module' object has no attribute 'Serial'となる恐れがある。
- Pythonを実行する際にはシリアルモニタ/プロッタを閉じておく。
開いたままだと、実行時にアクセス拒否される。よって、モニタで温湿度を確認しながらPythonで表示させることはできない。
【Arduino#7】ライブラリのインストール
前回まで用いていた照度センサ以外にも温湿度が測れるDHT11という温湿度センサを使用してみる。
しかし，調べてみるとライブラリが必要らしいので，ライブラリをインストールする方法についてまとめておく。
ライブラリによって，インストール方法が異なる場合があるのでそれらについて以下にまとめた。
ちなみに，私の場合
と，異なる。
【Arduino#6】照度センサでLED明るさ調節
前回照度センサ（以下，CdS）から値を読み取り，シリアルモニタに表示させた。
今回はこの読み取った値を用いてLEDの明るさを調整する。
といっても，今まで行ってきた内容を組み合わせることで簡単に実装できる。
1. 必要素子
- ブレッドボード
- 抵抗(10kΩ) 2個
- CdS
- LED
- ジャンパー線 5本
2. 配線図
3. スケッチ
const int CdS = 0; //CdSを0番pinに設定 const int LED = 11;//LEDを11番pinに設定 int val = 0; //A0から読み込んだ値を格納する変数 void setup() { pinMode(LED,OUTPUT);//LEDpinを出力に設定 Serial.begin(9600); //9600bpsでシリアルポートを開く } void loop() { val = analogRead(CdS); //CdSpinから電圧値を読み取る Serial.print("CdS val:");//シリアルポートへ()内を出力（改行無し） Serial.println(val); //シリアルポートへ()内を出力（改行有り） analogWrite(LED,val/4); //LEDpinにCdS値に応じたPWM波を出力 delay(100); //0.1秒ごとにループ }
ここで，シリアルポートへCdSの読み取り値を出力しているのは，LEDの明るさが変化する様子をシリアルモニタ上に表示されるCdS valと照らし合わせるためである。
従って，Serial.~~~~は無くても動作に問題はない。
また， analogWrite(LED,val/4)でvalを4で割ることにより，[0～1023]のレンジをanalogWrite用のレンジ[0~255]に変換している。
4. スケッチで用いた関数まとめ
各々の関数についてまとめる。基本的にはArduino Referenceで説明されている。
const int CdS = 0; const int LED = 11;
変数を読み取り専用の変数として定義するもの
不変の値を設定したい時にconstを用いると良い。
pinMode(LED,OUTPUT); //pinMode(pin番号, OUTPUT / INPUT / INPUT_PULLUP); //戻り値：なし
pinの動作を入力（INPUT, INPUT_PULLUP）か出力（OUTPUT）に設定する関数
入力には以下の2種類ある。
INPUT：普通の入力
INPUT_PULLUP：マイコン内部のプルアップ抵抗を利用する（回路簡素化できる）
Serial.begin(9600); //Serial.begin(転送レート); //戻り値：なし
シリアル通信の転送レートを指定する関数
単位はbpsである。基本的には300,1200,2400,4800,9600,14400,19200,28800,38400,57600,115200が使われる。
analogRead(CdS); //analogRead(pin番号); //戻り値：0～1023までの整数値
指定したpinからアナログ値を読み取る関数
基本的にはアナログpinの0～5番を用いる。
Serial.print("CdS val:"); Serial.println(val); //Serial.print(出力したいデータ[全ての型に対応]); //Serial.println(出力したいデータ[全ての型に対応]); //戻り値：送信したバイト数
データをシリアルポートへ出力する関数
- Serial.print ：改行せず，そのままシリアルモニタへ出力
- Serial.println：改行したものがシリアルモニタへ出力
analogWrite(LED,val/4); //analogWrite(pin番号, デューティ比に対応する値(0~255)); //戻り値：なし
指定したpinからPWM波を出力する関数
ここで，指定するpinはDigital pinの~がついているpin（3,5,6,9,10,11番pin）とする必要がある。
また，デューティ比に対応する値が0であれば0Vを出力，255であれば5V(3.3V)を出力する電圧源と等しくなる。
delay(100); //delay(時間[単位はms]); //戻り値：なし
指定した時間だけプログラムを止める関数
ここで，設定する時間はunsigned long型である。
【Arduino#5】照度センサの値読み取り
前回まではボタンスイッチを用いていたが，今回はセンサを使用してみる。
今回用いるのは照度センサである。
照度センサ（以下，CdS）とは，当たる光の量によって抵抗値が変化するセンサである。
例えば，CdSの置く場所を以下の様にすると，
- 明るい場所 ⇒ 抵抗値：小
- 暗い場所 ⇒ 抵抗値：大
といった振る舞いをする。この抵抗値が変化する特徴を用いて電子回路で安価なセンサとして使用される。
今回は，CdSの値を読み取り，PC（シリアルモニタ）上で確認するということをする。
1. 必要素子
- ブレッドボード
- 抵抗(10kΩ)
- CdS
- ジャンパー線 3本
2. 配線図
ここで，上の配線図で読み取っている電圧について説明する。
以下に上の配線図を回路図として示す。
上図のように，分圧則によって読み取り電圧は式(1)のように表される。
式(1)から光の量によってCdSの抵抗値が変化すると，読み取り電圧も変化することが分かる。この時，読み取り電圧は読み取り時に0～1023の数値に変換される。
つまり，変換された数値をCdS valとすると
となる。
3. スケッチ
const int CdS = 0; //CdSを0番pinに設定 int val = 0; //A0から読み込んだ値を格納する変数 void setup() { Serial.begin(9600); //9600bpsでシリアルポートを開く } void loop() { val = analogRead(CdS); //A0pinからアナログ値を読み取る Serial.print("CdS val:");//シリアルポートへ()内を出力（改行無し） Serial.println(val); //シリアルポートへ()内を出力（改行有り） delay(1000);//1秒ごとにループ }
<シリアルモニタ上>
2章で説明したとおり，明るい場所ではCdS valが1023に近づき，暗い場所では0に近づくことが確認できた。
4. スケッチで用いた関数まとめ
各々の関数についてまとめる。基本的にはArduino Referenceで説明されている。
const int CdS = 0;
変数を読み取り専用の変数として定義するもの
不変の値を設定したい時にconstを用いると良い。
Serial.begin(9600); //Serial.begin(転送レート); //戻り値：なし
シリアル通信の転送レートを指定する関数
単位はbpsである。基本的には300,1200,2400,4800,9600,14400,19200,28800,38400,57600,115200が使われる。
analogRead(CdS); //analogRead(pin番号); //戻り値：0～1023までの整数値
指定したpinからアナログ値を読み取る関数
基本的にはアナログpinの0～5番を用いる。
Serial.print("CdS val:"); Serial.println(val); //Serial.print(出力したいデータ[全ての型に対応]); //Serial.println(出力したいデータ[全ての型に対応]); //戻り値：送信したバイト数
データをシリアルポートへ出力する関数
- Serial.print ：改行せず，そのままシリアルモニタへ出力
- Serial.println：改行したものがシリアルモニタへ出力
delay(1000); //delay(時間[単位はms]); //戻り値：なし
指定した時間だけプログラムを止める関数
ここで，設定する時間はunsigned long型である。
