Example Idyll Markdown for Graphic Annotation!

index.idyll

[Header
  fullWidth:true
  title:"Testing Annotation Component with Image and Graphics"
  date:"May 27, 2021"
  background:"#222222"
  color:"#ffffff"
   /]


Normal 
[Annotation]
  [Graphic]This text is the stuff in the annotation box.
  [/Graphic]highlighted inline text.
[/Annotation]


[br/]
[br/]
[br/]

Move mouse over this
[Annotation]
  [Graphic]  This is Baby Yoda!
 [Image src:"https://upload.wikimedia.org/wikipedia/en/0/00/The_Child_aka_Baby_Yoda_%28Star_Wars%29.jpg" /] Cool, huh?[/Graphic]
 
 annotation with Image!
[/Annotation]

[br/]
[br/]
[br/]

[var name:"dataToBeCharted" value:`[
  {x: 0, y: 0.5},
  {x: 3.5, y: 0.5},
  {x: 4, y: 0},
  {x: 4.5, y: 1},
  {x: 5, y: 0.5},
  {x: 8, y: 0.5}
]` /]

Try moving mouse over [Annotation] 
  [Graphic] [Chart type:"line" data:dataToBeCharted domain:`[0, 8]` range:`[0, 1]` /]
  Annotation with Chart!
 [/Graphic]
  This is a random chart!
[/Annotation] instead.