<!DOCTYPE html >
<html>
<head>
<title> new document </title>
<meta charset="utf-8"/>
<link href="" type="text/css" rel="stylesheet"/>
</head>
<body>
<canvas id='canvas' width='600px'height='600px'style='background:orange'></canvas>
<script>
var canvas =document.getElementById('canvas');
var context=canvas.getContext('2d');
var x=-300;
//八卦
context.translate(canvas.width/2,canvas.height/2);
<html>
<head>
<title> new document </title>
<meta charset="utf-8"/>
<link href="" type="text/css" rel="stylesheet"/>
</head>
<body>
<canvas id='canvas' width='600px'height='600px'style='background:orange'></canvas>
<script>
var canvas =document.getElementById('canvas');
var context=canvas.getContext('2d');
var x=-300;
//八卦
context.translate(canvas.width/2,canvas.height/2);