動的画像作成(棒グラフ)  次の文書

SqlServerのテーブルからKEYと値を取得 その値で棒グラフを作成

Dim cn As New SqlConnection(ConfigurationManager.ConnectionStrings("LocalSqlServer").ToString())
cn.Open()

'---本日GETのデータ有無確認-----------------------------
Dim 本日a As String
Dim 本日b As String
本日a = Now().ToString("yyyyMMdd")
本日b = Now().ToString("yyyy/MM/dd")

Dim DataCnt As Integer = 0
Dim max値 As Integer = 0

'Dim cntGET As New SqlCommand("SELECT TOP 100 MAX(count) FROM counter WHERE [KEY] < '88888888'", cn)
'Dim p本日 As SqlParameter = cntGET.Parameters.Add("@p本日", Data.SqlDbType.Char, 8)
'p本日.Value = 本日a
'Dim drcntGET As SqlDataReader = cntGET.ExecuteReader()
'While drcntGET.Read()
'max値 = drcntGET.Item(0)
'End While

Dim Wdd(100) As String
Dim Wcnt(100) As Integer
Dim cntGET As New SqlCommand("SELECT top 100 * FROM counter WHERE [KEY]<=@p本日 ORDER BY [KEY] DESC", cn)
Dim p本日 As SqlParameter = cntGET.Parameters.Add("@p本日", Data.SqlDbType.Char, 8)
p本日.Value = 本日a
Dim drcntGET As SqlDataReader = cntGET.ExecuteReader()
While drcntGET.Read()
DataCnt = DataCnt + 1
Wdd(DataCnt) = Right(drcntGET("KEY"), 2)
Wcnt(DataCnt) = drcntGET("count")
If max値 < drcntGET("count") Then max値 = drcntGET("count")
End While

drcntGET.Close()

cn.Close()

'MAX値を10分割でX軸の値表示する
Dim max値x軸(10) As String
For i = 1 To 10
max値x軸(i) = Int(max値 / i) - Int(max値 / 10)
If Len(max値x軸(i)) = 1 Then max値x軸(i) = "00" & max値x軸(i)
If Len(max値x軸(i)) = 2 Then max値x軸(i) = "0" & max値x軸(i)
Next i

' 幅、高さ
Dim img As New System.Drawing.Bitmap(640, 650)
Dim g As System.Drawing.Graphics = System.Drawing.Graphics.FromImage(img)
g.Clear(Color.Empty) '背景なし nulls(?)

'単色ブラシ
Dim brush1 As New System.Drawing.SolidBrush(System.Drawing.Color.FromArgb(&H90, &HD0, &HFF))

'グラデーションブラシ
Dim brush2 As New System.Drawing.Drawing2D.LinearGradientBrush(New System.Drawing.Point(0, 0), New System.Drawing.Point(img.Width - 1, img.Height - 1), Drawing.Color.Aqua, Drawing.Color.DarkBlue)

'Pen(一点鎖線)
Dim dashValues() As Single = {10, 2, 2, 2}
Dim dashPen As New System.Drawing.Pen(Drawing.Color.Red)
dashPen.DashPattern = dashValues
dashPen.Width = 1

'フォント(Arial, 11, Bold)
Dim font1 As New System.Drawing.Font("Arial", 12, Drawing.FontStyle.Bold)

With g
Dim W増加値x As Decimal = 640 / max値 '高さ 数値1の1目盛
Dim W値x As Integer = 0
Dim W増加値y As Decimal = 650 / 100 '幅
Dim W値y As Integer = 50
Dim Wi As Integer = 0

'データが100個 グラフの右側から描写する
For i = 100 To 1 Step -1
W値x = Int((Wcnt(i) * W増加値x))
W値y = Int((i * W増加値y))
' 左から、  上から   幅 厚み
.FillRectangle(brush2, W値y + 50, 640 - W値x - 40, 3, W値x) '長方形の棒グラグ
Dim W上から As Integer = Int(640 - W値x - 50)
If W上から < 10 Then W上から = 10
If Wcnt(i) > 30 Then
.DrawString(Wcnt(i), font1, Drawing.Brushes.White, W値y + 50, W上から) 'Y軸目見出し盛
End If
'Wcnt(DataCnt)
Next

End With
'
' イメージ転送(pngフォーマット)
'
Response.ContentType = "image/png"
Dim memStream As New System.IO.MemoryStream
img.Save(memStream, System.Drawing.Imaging.ImageFormat.Png)
memStream.WriteTo(Response.OutputStream)

合体の参照ページ
https://techracho.bpsinc.jp/sugiyama/2018_02_01/51853

 



背景と合体させたページのイメージ



← 左の文字をここへ入力後 登録ボタンをクリックしてください

(サイト管理者承認後掲載されます)