diff --git a/console/client/src/sections/console/containers/index.js b/console/client/src/sections/console/containers/index.js
index 5d7218e..25767b0 100644
--- a/console/client/src/sections/console/containers/index.js
+++ b/console/client/src/sections/console/containers/index.js
@@ -68,7 +68,7 @@ function Index (props) {
         }
         const canvasArea = document.getElementById('canvasArea')
         const canvasHeight = canvasArea.clientHeight - 12 * 2 - 6
-        const canvasWidth = canvasArea.clientWidth - 12 * 2
+        const canvasWidth = canvasArea.clientWidth / 14 * 10 - 12 * 2
         const mainColor = "rgb(249,179,45)"
         if (type == 'xy') {
             // xy 视图
@@ -531,7 +531,7 @@ function Index (props) {
                 <Row style={{
                     height: '100%',
                 }}>
-                    <Col span={14} style={{ paddingRight: 8, maxHeight: '100%' }}>
+                    <Col span={14} id="canvasArea" style={{ paddingRight: 8, maxHeight: '100%' }}>
                         <div className='card' style={cardStyle}>
                             <canvas ref={xzCvs} id='xzCvs' height={120} width={120} style={{ display: 'none' }}>
                                 您的浏览器不支持canvas,请更换浏览器.
@@ -549,7 +549,7 @@ function Index (props) {
                         </div>
                     </Col>
                     <Col span={10} style={{ paddingLeft: 8, }}>
-                        <div className='card' id="canvasArea" style={cardStyle}>
+                        <div className='card' style={cardStyle}>
                             <canvas ref={xyCvs} id='xyCvs' height={120} width={120} style={{}}>
                                 您的浏览器不支持canvas,请更换浏览器.
                             </canvas>