ブログ上にテロップテキストを表示してみる
概要
ブログ上へ表示可能な、テロップテキストをjavascriptで作成してみました。
追記
marqueeタグって便利なのあったんですね～
<Marquee><font size="5" color="red">わずか1行で、テロップ表示！！</font></Marquee>
サンプル
関数部
<script type="text/javascript">// <![CDATA[-- function RunTicker(Text, Size, color) { if (typeof TickerIndex == "undefined") { TickerIndex = 0; } else { TickerIndex++; }; var TickerName = 'TickerText' + TickerIndex; var len = Text.length; var arrText = Text.split(''); var si = 0; document.write("<span id='" + TickerName + "'></span>"); var Ele = document.getElementById(TickerName); var id = setInterval(function () { var buftext = ''; for (i = 0; i < len; i++) { var ti = si + i - len; if (ti < 0 || ti >= len) { buftext += ' ' } else { buftext += arrText[ti] }; }; Ele.innerHTML = buftext.fontsize(Size).fontcolor(color); si++; if (si >= len * 2) { si = 0 }; }, 200); } // ]]></script>
表示部
<p><script type="text/javascript">RunTicker('これが、テロップテキストです。', 5, 'red');</script></p>
解説
javascriptコードです。
関数部を
はてな表記、または、HTML編集の一番上に貼り付けます。
※実際には、一番最初の"表示部"のコード以前であれば動作するはずです。
後は"表示部"のコードを表示したい場所へ置きます。
文字列の設定ですが
RunTickerの()の内容を、","(ドット)区切りで３個要素を設定してください。
要素の詳細は、以下の通りです。
RunTicker('[ココに表示したい文字列]', フォントの大きさを数値で指定, '表示色')
表示色についてですが
"red"、 "yellow"、 "blue"など指定できますが
"#FFFFFF"形式でも指定できます。（#FFFFFFは、白となります。）
カラーコードについては、以下のサイト参照頂いたほうが良いでしょう。
最後に
以前の
は、１つ以上を配置することが出来ませんでしたが
"表示部"のコードを複数配置することで、多数のテロップテキストを表示可能です。
また、タグをspanとしましたので
一行内に、通常のテキストと、
を配置可能です。
ただ・・・
等角フォントの全角以外のフォントだと、文字により幅が変わる為
後続テキストが、次のようになります。
この部分が落ち着かない！！
Iphoneなどで見ると、もう最悪です・・・
難しいですね～(ﾟｰﾟ;Aｱｾｱｾ
JavaScriptで作ったパーツでブログを飾ってみる
サンプル
<script type="text/javascript">// <![CDATA[ var Rainbow = "ココに表示したい文字列"; var Size = 5; var sci = 0; var len = Rainbow.length; document.write("<p id='RainbowText'>" + Rainbow + "</p>"); var Ele = document.getElementById("RainbowText"); var ArrColor = ["red", "orangered", "yellow", "green", "blue", "Indigo", "Violet"] RunRainbow(); function RunRainbow() { var aft = ""; var tci = 6 - sci; for (i = 0; i < len; i++) { aft += Rainbow.charAt(i).fontcolor(ArrColor[tci]); tci++; if (tci > 6) { tci = 0 }; } sci++; if (sci > 6) { sci = 0 }; Ele.innerHTML = aft.fontsize(Size); setTimeout('RunRainbow()', 300); } // ]]></script>
解説
javascriptコードです。
はてなブログの、見たままでブログを作成している場合
例えば
ココから ココまで
と作成していたとします。
その状態で、HTML編集に切り替えると下記のようになります。
<p>ココから</p> <p>ココまで</p>
後は、”<p>ココから</p>”と”<p>ココまで</p>”の間に
上記ソースコードを丸々張り付けると、”ココから”と”ココまで”の間へ表示されます。
はてな記法の方は、そのまま張り付けてOKです。
ちなみに自分は、はてな記法を使ったのは、本日初だったしして・・・(;^_^A
次に、表示する文字列ですが
サンプルコード上側の”ココに表示したい文字列”
という所に、好きな文字列を入れてください。
そのすぐ下の
var Size = 5;
は、フォントのサイズです。
色の流れるスピードを変更したい場合は、サンプルコード下側の
setTimeout('RunRainbow()', 300);というところがありますので、"300"という値を変更します。
値が小さくなるほど早くなります。
まとめ
あまり、javascriptでプログラムした経験ありません。
取り敢えず言い訳 ヾ(＠°▽°＠)ﾉあはは
サンプルコードが、長くなってしましました・・・
また、1ヵ所以上の配置が出来ないのが残念ですね。
改良の余地はありそうです。
フォルダ内のファイル一覧を取得し表示してみる
概要
指定した、フォルダ内のファイルを一覧表示します。
準備
Button.Button1(FolderBrowserDialog表示用)
Button.Button2(ファイルリスト取得実行用)
ListBox.ListBox1(ファイルリスト表示用)
FolderBrowserDialog.FolderBrowserDialog1
を設置しましょう。
サンプル
Private Sub Button1_Click_1(sender As Object, e As EventArgs) Handles Button1.Click
'フォルダ選択画面を表示し
'ＯＫが押された時に、TextBoxへ選択フォルダのPathを表示
If FolderBrowserDialog1.ShowDialog() = DialogResult.OK Then
TextBox1.Text = FolderBrowserDialog1.SelectedPath
End IfEnd Sub
Private Sub Button2_Click(sender As Object, e As EventArgs) Handles Button2.Click
'TextBoxへ指定したディレクトリが存在するかのチェック
If Not Directory.Exists(TextBox1.Text) Then
MsgBox("指定のディレクトリは存在しません。")
Exit Sub
End If'フォルダ内の一覧を配列に取得
Dim Arrfile As String() = Directory.GetFiles(
TextBox1.Text, "*", SearchOption.TopDirectoryOnly
)'配列をListBoxへ表示
ListBox1.Items.AddRange(Arrfile)End Sub
解説
FolderBrowserDialogを利用し、Dialogでフォルダを選択可能としました。
FolderBrowserDialog.ShowDialog()を呼び出すだけで表示してくれます。
便利ですね～。
FolderBrowserDialog.SelectedPath()
で選択されたフォルダのPathを取得します。
次に Directory.GetFiles ですが
TextBox1に指定したフォルダの
*すべてのファイル
SearchOption
を引数として渡すと、ファイル一覧を配列で返してくれます。
SearchOptionは
TopDirectoryOnly 現在のフォルダのみ
AllDirectories サブフォルダを含む
がありますが
今回は、「指定フォルダのファイルのみ。」としましたので
TopDirectoryOnlyとなります。
実行結果
まとめ
「あるフォルダの全てのファイルに対して、一度に同じ処理を行いたい。」
時など、あるかと思いますが、そういう時などに有効です。
RaspberryPiファンコントロール
概要
CPU温度によりファンの回転数を制御します。
「RaspberryPi３は速度向上の代償として、発熱量が多くなった。」
と言われています。
一応、熱対策としてファンを導入したのですが
ファンがフル回転した状態だと、気になる程の音を出していたのと
貧弱なケースのおかげで
「振動と共振して音量が倍増してしまう。」
という最悪な状態で、CPUは、涼しそうでは無かったです。
サンプル
CPUFan.py
# -*- coding: utf-8 -*-import RPi.GPIO as IOimport commandsimport time
#ピン番号指定
IO.setmode(IO.BOARD)
#10番ピンを出力として利用
PinPut = 10IO.cleanup(PinPut)IO.setup(PinPut, IO.OUT )#PWM設定（1秒間の間に5個のパルスを作成）
PWM = IO.PWM(PinPut, 5)PWM.start(0)
while True:#CPU温度の取得temp = commands.getoutput("vcgencmd measure_temp").split('=')ftemp = float(temp[1].replace('\'C', ''))#温度により出力を算出（40～50℃の間を70～100％で）pw = (ftemp - 40) / 10if pw < 0: pw = 0if pw > 1: pw = 1
Duty = pw * 30if pw > 0: Duty += 70#PWM変更PWM .ChangeDutyCycle(Duty)#CPU温度とファンパワーを表示print 'temp:' + str(ftemp) + ' FANPW:' + str(pw)
time.sleep(1)
回路図
解説
PinPutの値を変えることにより
ファンコントロール出力のIOピン位置を変更できます。
IOの利用状況に応じて変更してください。
IO.BOARD指定ですので、ピンの並び順に数えた位置となります。
ちなみにGPIOの番号に対応させたい場合は
#ピン番号指定を
IO.setmode(IO.BCM)
とします。
ファンの電圧は、このサンプルの場合５Vとしてください。
ファンの種類によっては
低パワー時に回転出来ない可能性があります。
#温度により出力を算出
辺りを適正値に修正しましょう。
回路図作成はfritzingを利用しました。
ダウンロードサイトよりNo Donationを選択で
無料ダウンロードできます。
PWM・Dutyについては、PWM・Duty参考図を参照してください。
PWM・Duty参考図
Csvファイルを読み込みDataGridViewへ表示してみる
概要
Csvファイルを読み込みDataGridViewへ表示します。
なお、Csvファイル１行目はヘッダー行として扱い
DataColumnを生成します。
準備
Button.Button1(DTTest呼び出し用)
DataGridView.DataGridView1
を設置してください。
適当な場所へ以下のようなCsvデータファイルを作成しましょう。
TestData.csv
教科,点数
国語,24
数学,75
理科,67
社会,37
赤点２教科ありますね… (爆)
サンプルコード
Private Sub Button1_Click_1(sender As Object, e As EventArgs) Handles Button1.Click
CsvToGrid()
End Sub
Sub CsvToGrid()
Dim Path As String = "D:\Temp\TestData.csv" 'CsvファイルのPathを指定
Dim SR As New StreamReader(Path) 'StreamReader
Dim linebuf As String 'データ保持用'DataGrid初期化
DataGridView1.Columns.Clear()'Csvファイルより1行読込（ヘッダー行）
linebuf = SR.ReadLine()'データが無ければ終了
If linebuf = Nothing Then Exit Sub'DataGridColum（列）生成
Dim ColArr() As String = linebuf.Split(",")
For Each buf In ColArr
DataGridView1.Columns.Add(buf, buf)
Next
Do'Csvファイルより２行目以降読込み
linebuf = SR.ReadLine()'データが無ければループ終了
If linebuf = Nothing Then Exit DoDim RowArr() As String = linebuf.Split(",")
'DataGrid行を追加
DataGridView1.Rows.Add(RowArr)
LoopSR.Close()
End Sub
解説
StreamReaderを使い、ReadLine()で１行ずつCSVファイルの内容を読み取っています。
ReadLine()を呼ぶ度に、Csvファイルの次の行の読み込みを行います。
後は、Split()を使い、","(カンマ)を機切り文字としてデータ毎に分割を行い
DataGridColumの生成、および配列データでRowを追加しています。
StreamReaderの動作中は、対象ファイルがロックされます。
処理が終わったら、Close()しましょう。
尚、Csvファイルは直接DataTableに読み込むことも可能ですので
機会がありましたら記事にしたいと思います。
実行結果
RaspberryPiについて
皆さん、こんにちは。
早速ですが
RaspberryPiってご存知でしょうか？
名前もロゴもすごく美味しそうですよね～（笑）
イギリス発祥のお菓子・・・ではありません。
私が、初めてこのネーミングを聞いたときは
恥ずかしながら食べ物かと思いましたので…
詳しくはこちらから。
セットアップ方法など、説明しようと思いましたが
色々な方が詳しく説明していらっしゃいましたので
誠に勝手ながら今回はこちらの方を頼らさせて頂きました。
GPIOを利用した電子工作的なもの、Pythonなど興味ありますので
「ブログのネタに出来れば良いな～。」
と思っております。
とは言っても、電子工作もPythonも初心者ですので心配ですが…
今後ともよろしくお願いします。
VB.Netよりコマンドを実行
概要
VB.Netよりコマンドを実行し、結果をTextで返します。
Function Runcmd(strcmd As String) As String
'Processオブジェクト
Dim proc As New System.Diagnostics.Process()
With proc.StartInfo
'ComSpecパスの取得
.FileName = System.Environment.GetEnvironmentVariable("ComSpec")
'出力読取り可能化
.UseShellExecute = False
.RedirectStandardOutput = True
.RedirectStandardInput = False
'コマンドプロンプトのウィンドウ非表示
.CreateNoWindow = True
'コマンド(/c:コマンド実行後、コマンドを実行したcmd.exeを終了)
.Arguments = "/c " & strcmd
End With
'コマンド実行
proc.Start()
'実行結果取得
Dim result As String = proc.StandardOutput.ReadToEnd()
proc.WaitForExit()
proc.Close()Return result
End Function
解説
コマンド(String)を引数としてRuncmdを呼びます。
戻り値としてテキストで結果が返ってきます。
先日、ご紹介したフリーソフト
ServerLogon（ソフトと呼べる程のものではありませんが…）
は、net use～を引数としてRuncmdを呼んでいます。
Runcmd呼び出しサンプル
準備
Button.Button1(Runcmd呼び出し用)
TextBox.TextBox1(結果表示用)
をセットしてください。
TextBox1は、MultilineをTrueにしましょう。
Private Sub Button1_Click_1(sender As Object, e As EventArgs) Handles Button1.Click
Dim text As String
'コマンド
text = Runcmd("ipconfig /all")
TextBox1.Text = textEnd Sub
実行結果
