Notebooks 2.0 is here.
Read the preview announcement
Platform
Resources
Pricing
Sign in
Get started
xi li
Workspace
Fork
Published
By
xi li
Edited
Mar 24, 2020
Insert cell
md
`# G event`
Insert cell
G
=
require
(
"@antv/g@3"
)
Insert cell
{
const
container
=
html
`<div></div>`
;
const
canvas
=
new
G
.
Canvas
(
{
containerDOM
:
container
,
width
:
400
,
height
:
300
,
pixelRatio
:
1
}
)
;
canvas
.
addShape
(
'rect'
,
{
attrs
:
{
x
:
0
,
y
:
0
,
width
:
400
,
height
:
300
,
stroke
:
'black'
}
}
)
const
shape
=
canvas
.
addShape
(
'circle'
,
{
attrs
:
{
x
:
10
,
y
:
10
,
r
:
5
,
fill
:
'red'
}
}
)
;
canvas
.
draw
(
)
;
canvas
.
on
(
'mousemove'
,
function
(
ev
)
{
shape
.
attr
(
{
x
:
ev
.
x
,
y
:
ev
.
y
}
)
canvas
.
draw
(
)
;
}
)
return
container
;
}
Insert cell
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Try it for free
Learn more
Fork
View
Export
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
G
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML