Microsoft Small Basic

Program Listing:
Embed this in your website
' Molecular Structure of Water
' Version 0.1
' Copyright © 2019 Nonki Takahashi. The MIT License.
' Last update 2019-11-16

GraphicsWindow.Title = "Molecular Structure of Water"
GraphicsWindow.BackgroundColor = "LightGray"
atom["O"] = "color=#EE0000;size=100;"
atom["H"] = "color=White;size=50;"
gap = 20
a = 104.45  ' [degree]
gw = GraphicsWindow.Width
gh = GraphicsWindow.Height
mol = "H_2O"
DrawMolecularName()
' draw line (1)
x1 = gw / 2
y1 = gh * 0.45
size = atom["O"]["size"]
_size = size
size = atom["H"]["size"]
r = _size / 2 + size / 2 + gap
_ah = Math.GetRadians(a / 2)
x2 = x1 - r * Math.Sin(_ah)
y2 = y1 + r * Math.Cos(_ah)
GraphicsWindow.PenColor = "DimGray"
GraphicsWindow.PenWidth = 4
GraphicsWindow.DrawLine(x1, y1, x2, y2)
' draw H (1)
ox = x2
oy = y2
bc = atom["H"]["color"]
FillCircle()
' draw line (2)
x2 = x1 + r * Math.Sin(_ah)
GraphicsWindow.DrawLine(x1, y1, x2, y2)
' draw H (2)
ox = x2
FillCircle()
' draw O
ox = x1
oy = y1
size = atom["O"]["size"]
bc = atom["O"]["color"]
FillCircle()

Sub DrawMolecularName
  GraphicsWindow.FontName = "Trebuchet MS"
  GraphicsWindow.BrushColor = "Black"
  x = 30
  For p = 1 To Text.GetLength(mol)
    c = Text.GetSubText(mol, p, 1)
    If c = "_" Then
      y = 35
      p = p + 1
      fs = 20
      c = Text.GetSubText(mol, p, 1)
    Else
      y = 20
      fs = 30
    EndIf
    GraphicsWindow.FontSize = fs
    GraphicsWindow.DrawText(x, y, c)
    x = x + fs * 0.7
  EndFor
EndSub

Sub FillCircle
  GraphicsWindow.BrushColor = bc
  GraphicsWindow.FillEllipse(ox - size / 2, oy - size / 2, size, size)
EndSub
Copyright (c) Microsoft Corporation. All rights reserved.