Interaction Designer, Creative Technologist, Professor and Researcher
Public
Edited
Mar 11, 2021
2 forks
2 stars
processing(meuSketch, 'width: 160px; height: 170px;')
p5(p5_code, 'width: 160px; height:170px')
pythonProcessing(codePy, 'width: 160px; height: 170px;')
p5(CodigoViaAce, "width: 400px; height: 170px;")
viewof CodigoViaAce2 = {
let codigoinicial = ``;
// Instanciando o editor
const { editor, view } = ace(
codigoinicial,
{ fontSize: "0.8em", height: "260px" },
{
theme: "ace/theme/xcode",
selectionStyle: "text",
highlightActiveLine: false,
mode: "ace/mode/javascript",
enableBasicAutocompletion: true,
enableLiveAutocompletion: true,
enableSnippets: true,
showPrintMargin: false,
showGutter: true
}
);
// Captura o valor inicial
view.value = editor.getValue();
// Reage a qualquer mudança feita no editor
editor.on('change', () => {
view.value = editor.getValue();
});
return view;
}
viewof CodigoViaAce3 = {
let codigoinicial = `
def setup():
createCanvas(160, 160)
background(255)
def draw():
stroke('#2299FF')
radius = (sin(frameCount / 60) * 15) + (sin(frameCount / 60) * 15)
rect(30, 30, radius, radius)
`;
// Instanciando o editor
const { editor, view } = ace(
codigoinicial,
{ fontSize: "0.8em", height: "260px" },
{
theme: "ace/theme/xcode",
selectionStyle: "text",
highlightActiveLine: false,
mode: "ace/mode/python",
enableBasicAutocompletion: true,
enableLiveAutocompletion: true,
enableSnippets: true,
showPrintMargin: false,
readOnly: true,
showGutter: true
}
);
// Captura o valor inicial
view.value = editor.getValue();
// Reage a qualquer mudança feita no editor
editor.on('change', () => {
view.value = editor.getValue();
});
return view;
}
pythonProcessing(CodigoViaAce3, 'width: 160px; height: 170px;')
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.
