ChatGPTと協力しながら文章執筆やコーディングなどの作業をこなせるアプリ「Canvas」のベータ版が2024年10月3日にリリースされました。記事作成時点ではChatGPT Plusの加入者向けにベータテストが実施されており、テストの終了後は無料ユーザーも利用可能になる予定です。 Canvas is a new way to write and code with ChatGPT | OpenAI https://openai.com/index/introducing-canvas/ Canvasでは「ChatGPTに文章やコードの下書きを入力して清書させる」「ChatGPTが生成した文章の一部を人力もしくはChatGPTに依頼して修正する」といった操作が可能です。内部では「GPT-4oを共同作業用にトレーニングしたモデル」が動作しており、OpenAIはCanvasを「ChatGPT
前置き プログラミング初心者のため、見苦しいコードが多いです。プログラムを組んで何か作るの好きです！ ※ 2020/10/30追記 Pythonでボイドを利用したゲームを作ってみたので良かったら見てください。 【Tkinter実践】Pythonでオリジナルゲームを作る 生き物に関するプログラミングがしたい！ 小さいころから生き物が好きだった。プログラミングで生物の行動シュミレーションなど出来たら面白そうだ。 調べたらボイドというアルゴリズムを見つけた。 ボイドって？ ボイド(Boids)は、アメリカのアニメーション・プログラマ、クレイグ・レイノルズが考案・作製した人工生命シミュレーションプログラムである。名称は「鳥もどき(bird-oid)」から取られている。 wikipediaからの引用。コンピュータ上に鳥オブジェクトを作成し、それに対して以下の3つのルールを作用させるだけで、鳥の群れを
Originally written in: English • Русский (авторский перевод) Translated by readers into: Deutsch • Español • Français • Português do Brasil • Svenska • Tiếng Việt • తెలుగు • 日本語 • 简体中文 • 繁體中文 • 한국어 Read the original • Improve this translation • View all translated posts 多くの人は、私が実際に持っている知識量より遥かに多くのことを知っていると思い込んでいる。それは悪い事ではないので文句を言っているわけではない。(世の少数派の人達は、努力して資格を得ているにもかかわらず、逆の偏見に苦しめられている。それはイケてない。) この記
好きな言葉でひらがなの練習ができるプリントが作れるサービス「ひらがなプリントメーカー(仮)」を公開した。今後カタカナにも対応したり、文字練習以外の教材の生成ができるようにすることもぼんやり考えているので、名前は変わるかもしれない。 (2019年01月11日追記) 0〜9の数字にも対応したので「かきかたプリントメーカー」に改名した。さらにカタカナもサポートした。 紙の向きや縦書き横書き、文字サイズが切り替えられるようになっている。書き順もつけることができるので、数字をおぼえた子ならひとりでもできる。 PDFファイルを生成するので、そのまま自宅やコンビニのプリンタできれいに印刷できる。スマホでぽちぽち作って帰り道にコンビニで印刷してお土産に持って帰るなんてこともできる。 もともとうちの3歳の娘のために作ったのだが、これはけっこう需要があるだろうということで真面目に作り込んで公開した。 市販の子
プログラミングでお絵かきする試みを続けるうちにスケッチが100個ほど溜まりました。 似たようなことをして遊んでみたい人のために、過去のスケッチを例に出しつつ、アイディアというかネタというか、そういうのを列挙してみます。 これはProcessing Advent Calendar 2018 - Qiitaの6日目の記事です。遅刻！ 序 初めて作り、完成したのはライフゲームだったと思います。簡単なプログラミングだけで複雑怪奇な振る舞いをするシステムを作れるという事実に、目の覚めるような驚きを感じつつ、魔法の金槌を手に入れたような気分になりました。 プログラミングさえあれば新鮮な驚きと感動に飢えることなく、人生はずっと面白いままなのだろうという予感を覚えました。 ── ポーン（ゲーム制作者）*1 この文章がずっと印象に残っています。 それはたぶん私も似たような原体験を持っているからで、そういう人
将棋駒画像分類の話の続きのような、あんまり関係もないような。 memo.sugyan.com memo.sugyan.com 結局、素材を組み合わせて自動で生成しただけの駒画像ではやはりデータが足りていないようで、「やはりもっと様々な画像から人力でラベル付けしてデータセットを作っていく必要がありそう」ということになった。 とはいえ、インターネットから画像を拾ってこようと思うと、例えば以下のような感じで (引用元: フリー写真素材ぱくたそ) 多少ならともかく 斜めの角度から写っているものは、そのまま矩形に切り出して学習用画像データに利用するのは難しそう。 これらはうまいこと変形して使いたい。 いわゆるperspective projectionの逆変換のような操作が必要になる。 JavaScriptを使ったCanvas APIでの変換では簡単な拡大・縮小などの変換は可能だけど こういったpe
VS CodeがDOMによるターミナル実装のパフォーマンスを改善できなかったためCanvasに変更
Integrated Terminal Performance Improvements Electronという史上まれに見るそびえ立つクソのようなGUIプラットフォーム上で実装されているVS Codeが、ターミナルの実装をDOMによるものからCanvasによるものに変更したそうだ。これは、DOMによる実装ではパフォーマンスの改善が十分にできなかったからだという。 DOMでターミナルを実装する際の問題ごととして、テキスト選択、テキストアライメント、GC、パフォーマンスを上げている。 テキスト選択：ターミナルのテキスト選択を実現するためにDOMのテキスト選択の挙動をだいぶ上書きしなければならない。 テキストアライメント：一部の文字はモノスペースになってくれず、workaroundとして一文字ごとに固定長のspanで包む必要があるが、これはパフォーマンス上よろしくない。 GC：DOMでターミナ
とても久々に（というかわりと初めてまともに）HTML5 な Web アプリを作った気がするので、作ったものとやって捗ったことをまとめておく。 つくったもの 理研の仁科加速器研究センターさんの展示コンテンツ。 陽子・中性子の数を組み合わせて原子核を探してみよう、というもの。 まずはこちらをどうぞ: 原子核を見つけよう！ – 仁科加速器研究センター コーディングスタイル こちらを参照しながら生JSで書いてみた。 Google流 JavaScript におけるクラス定義の実現方法 AltJSは長くメンテするプロダクトではない＋重厚長大にはならないと判断しスルー。 ライブラリ Three.js three.js - Javascript 3D library JSで3Dを手軽に扱うためのライブラリ。Processingの3Dと似たかんじで書ける。 ただ重力（引力）が特定"方向"のみにしかかけられず
みなさんは「3Dホログラム」をご存知でしょうか？ 空間に映像を投影するというもので、スター・ウォーズなどSFのイメージがあるかもしれませんが、近年ではTIFFANYのプロモーションやマイケル・ジャクソンのライブなどでも使用されている技術です。 近未来感のある技術ですが、スマートフォンとCDケースで簡易的なものが自作できると2015年夏に話題になりました。これはCDケースの透明なプラスチック板を使って投影機を作成し、スマートフォンの画面の上に設置し、専用の動画を再生して投影するものです。 週末に子供と遊ぶネタにちょうどいいなと私も作ってみようと思ったので、投影する映像をHTML5 Canvasで実現してみました。 投影機の作成 投影機は、台形型（上辺1：下辺6：高さ3.5の比率）の透明な板を4枚組み合わせて作成します。今回はiPadのサイズに合わせて、「2.5cm × 14.8cm × 8.
HTML5 Canvasのフレームワーク「CreateJS」(基本的な使い方は入門サイトをご覧ください）について、2015年2月10日に開催されたCreateJS勉強会 (第5回) でライトニングトーク「CreateJSとNode.jsを使ってサーバーでCanvas要素を使おう」を発表しました。今回はそのスライドを元に、サーバーサイドでCreateJSを使うメリットを紹介します。 デモ 今回紹介するnode-easelを使ったデモです。スマホ画面にTwitterのアイコンが、PC画面には白い矩形が表示されています。スマホで選んだTwitterのユーザーのアイコンがPC側でアニメーションします。画像加工はサーバーサイドで動くCreateJSを使って行われています。 Section1. Node.jsとモジュールについて Node.jsはブラウザではなくサーバーサイドで動くJavaScript
A ClojureScript-based HTML5 Canvas and SVG Graphics Playground, much like http://bl.ocks.org/ but specifically designed for showcasing small ClojuresScript code demos: The underlying agenda is to show how small simple functional programs can generate complex behaviour. This page shows some of the gists we know about. Why not add yours?
SamurAI Codingは情報処理学会主催で行われる国際プログラミングコンテスト。9月28日にシンガポール予選、10月11日にシリコンバレー予選、24日に日本予選が行われる。 公式サイト: https://samuraicoding.org/ ゲームは簡潔に言えば「サムライと犬を動かして陣取りをするゲーム」で、その動かすアルゴリズムをGunbai Scriptっていうこのゲーム専用の言語で実装して提出する。だから「慣れた言語やライブラリが使えるかどうか」っていう点での有利不利はなく、同じスタートラインから「理解し、よいプログラムを作る」という力を競い合うことができる。 ちなみに10月22日がソースコードの提出期限。24日は対戦が行われる日なので勘違いしないように。 ゲームルール ここではざっくりとルールの概要を解説する。ざっくりとしか書かないので細かいことはオフィシャルのPDFを参考に
僕のcanvas力はいまだ中学生男子並みなので、そもそもcanvasの一部のAPIにSame Origin Policy的なものが適用されることすら今日まで知らなかったのですが、どうやら 違う生成元がsrcに指定されているimgをputImageData -> その描画領域をgetImageDataしようとするとDOM Exception という感じに、普通に怒られちゃうみたいですね。知らんかった。 http://www.w3.org/TR/cors/#use-cases ↑のあたりに書いてあるのをみると、taintedなcanvas、というのですかね。getImageDataで同じ生成元から読み込んだimgの描画部分を指定しても怒られないけど、違う生成元の画像を描画した部分に少しでもかかっていると怒られるので、canvasってピクセルごとに "taintedか、そうでないか" を管理して
This is a small library that lets you easily save a WHATWG canvas element as an imagefile. Files needed: canvas2image.js, base64.js Draw on the canvas with the pretty boxes below using the mouse, then click the "Convert" buttons to convert it to a downloadable image - or the "Save" buttons to download the image file directly. Using the WHATWG canvas element, you can create all sorts of cool gr
Pure CSS Menu – light, fast, easy to make, SEO Friendly This is my favorite technique for making CSS rollover menus. Its a combination of image replacement technique, and pure CSS list menus. There is no javascript, and beneath it is valid XHTML code, so you don’t need to worry about SEO performance If your […]
例 y = sin x のグラフです。仕組みはソースを見てください。 canvasとは canvas要素はHTML 5で描画するための新しい仕組みです。座標は左上隅が原点で，右が x，下が y の向きです。 canvasの使い方 このページの例は次のようにしています。 <head> ...(略)... <script> function draw() { const canvas = document.getElementById('MyCanvas'); const context = canvas.getContext('2d'); context.strokeRect(1, 1, 628, 200); context.beginPath(); context.moveTo(1, 101); context.lineTo(629, 101); context.stroke(); con
canvas を使った JavaScript によるグラフ描画ライブラリ 2006-02-13-1: [JavaScript][Code] - new Javascript/Canvas Graph library http://aslakhellesoy.com/articles/2006/02/09/announcement-new-javascript-c ... HTML の canvas タグを使ったグラフ描画ライブラリ．アルゴリズムはスプリングモデル． canvas タグは Safari 2，Firefox 1.5，Opera 9 でサポートされている． 使い方は非常に簡単で，上記の画像は以下のソースで実現．本体は graph.js というファイル． <canvas id="people" width="350" height="350" style="border: 1px
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
