JavaScript圖畫，顧名思義就是使用JavaScript編寫的圖形。在現代Web開發中，圖形是非常重要的一個部分。隨著各種新型設備的出現，客戶端設備具有了更高的主機性能，也有了更多的能力，使Web開發者的創造力和發揮更加廣泛。因此，在編寫JavaScript圖形方面，我們可以進行無限的創造。

JavaScript圖畫可以實現簡單的圖形，也可以實現復雜的交互式圖形。在這方面，JavaScript的動畫效果非常顯著，使得我們可以實現各種精美的效果，例如文本特效、翻書效果、鎖屏效果、旋轉效果、放大縮小效果、圖片滑動效果、頁面滾動效果等等。

var webGLRenderer;
var camera;
var scene;
var renderTargetParameters;
var particleCount;
var renderer;
webGLRenderer = new THREE.WebGLRenderTarget(window.innerWidth, window.innerHeight, renderTargetParameters);
camera = new THREE.PerspectiveCamera(50, window.innerWidth / window.innerHeight, 1, 1000);
scene = new THREE.Scene();
renderer = new THREE.WebGLRenderer();
particles = new THREE.Geometry();
particleCount = 50000;
for(var i = 0; i< particleCount; i++) {
var pX = Math.random() * 500 - 250,
pY = Math.random() * 500 - 250,
pZ = Math.random() * 500 - 250,
particle = new THREE.Vector3(pX, pY, pZ);
particles.vertices.push(particle);
}

上面是一段基礎的three.js示例，使用WebGL創建粒子系統，創建的效果是隨機的幻彩色彩效果，很漂亮。

當然，JavaScript圖形的使用不僅限于創造新的交互界面，也可以用于制作各類優秀的2D、3D圖片。例如動漫、建筑、地圖等等。

var canvas = document.querySelector("#canvas");
var webGLRenderer = new THREE.WebGLRenderer({
alpha: true,
canvas: canvas
});
webGLRenderer.setClearColor(0x000000, 0);
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(75, canvas.width / canvas.height, 0.1, 1000);
camera.position.z = 5;
var light = new THREE.PointLight(0xffffff, 1);
light.position.set(0, 0, 100);
scene.add(light);
var boxGeometry = new THREE.BoxGeometry(1, 1, 1);
var boxMaterial = new THREE.MeshLambertMaterial({
color: 0xFFFFFF
});
var box = new THREE.Mesh(boxGeometry, boxMaterial);
scene.add(box);
function animate() {
requestAnimationFrame(animate);
box.rotation.x += 0.01;
box.rotation.y += 0.01;
webGLRenderer.render(scene, camera);
}
animate();

上面是一個簡單的three.js示例，使用WebGL創建了一個3D立方體場景，并添加了燈光效果，最后在動畫過程中不斷地旋轉立方體。

總結來說，JavaScript圖形是一個非常多樣化的領域，可以用于各種Web交互效果，也可以用于制作優美的圖片。JavaScript圖形與Web開發是息息相關的，對Web開發者而言，學習和掌握JavaScript圖形技術必然會大大提升開發效果和效率。