fl-web-component 2.1.1-beta.4 → 2.1.1-beta.6

package/dist/fl-web-component.css

@@ -1 +1 @@
-@charset "UTF-8";.fl-model-containor[data-v-3517cf88]{width:100%;height:100%;position:relative;cursor:pointer}[data-v-3517cf88] .tips-label{width:60px;color:#000;font:12px Helvetica;margin-top:-3em;padding:5px;text-align:center;vertical-align:middle;background-color:khaki}[data-v-3517cf88] .measure-label{max-width:100px;margin-top:-1em;border:10px;border-radius:5px;padding:3px 10px;cursor:pointer;color:#009bea;background-color:#f4f4f4;-webkit-box-shadow:0 1px 3px 1px rgba(0,0,0,.25);box-shadow:0 1px 3px 1px rgba(0,0,0,.25)}[data-v-3517cf88] .circle-tag{width:10px;height:10px;margin-top:5px;border-radius:50%;background-color:#ff5000}[data-v-3517cf88] .measure-label-font{word-break:break-all}[data-v-3517cf88] .mark-label-img{padding-top:5px;width:20px;height:20px}.loading-overlay[data-v-3517cf88]{position:absolute;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.7);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;z-index:1000;opacity:0;visibility:hidden;-webkit-transition:opacity .3s ease,visibility .3s ease;transition:opacity .3s ease,visibility .3s ease}.loading-overlay--visible[data-v-3517cf88]{opacity:1;visibility:visible}.loading-content[data-v-3517cf88]{background:#fff;border-radius:12px;padding:30px;text-align:center;-webkit-box-shadow:0 8px 32px rgba(0,0,0,.3);box-shadow:0 8px 32px rgba(0,0,0,.3);min-width:300px;max-width:400px}.loading-spinner[data-v-3517cf88]{width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid #409eff;border-radius:50%;-webkit-animation:spin-3517cf88 1s linear infinite;animation:spin-3517cf88 1s linear infinite;margin:0 auto 20px}@-webkit-keyframes spin-3517cf88{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin-3517cf88{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.loading-text[data-v-3517cf88]{font-size:16px;font-weight:500;color:#333;margin-bottom:20px}.loading-this.progress-bar[data-v-3517cf88]{width:100%;height:8px;background-color:#f0f0f0;border-radius:4px;overflow:hidden;margin-bottom:15px}.loading-this.progress-fill[data-v-3517cf88]{height:100%;background:-webkit-gradient(linear,left top,right top,from(#409eff),to(#67c23a));background:linear-gradient(90deg,#409eff,#67c23a);border-radius:4px;-webkit-transition:width .3s ease;transition:width .3s ease}.loading-details[data-v-3517cf88]{font-size:12px;color:#666;line-height:1.5}.lil-this.gui{background:hsla(0,0%,100%,.95)!important;border:1px solid #e0e0e0!important;border-radius:8px!important;-webkit-box-shadow:0 4px 12px rgba(0,0,0,.15)!important;box-shadow:0 4px 12px rgba(0,0,0,.15)!important;backdrop-filter:blur(10px)!important;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif!important}.lil-this.gui .title{background:linear-gradient(135deg,#f8f9fa,#e9ecef)!important;color:#495057!important;border-bottom:1px solid #dee2e6!important;font-weight:600!important;padding:0 12px!important;border-radius:8px 8px 0 0!important}.lil-this.gui .controller{border-bottom:1px solid #f1f3f4!important;background:transparent!important}.lil-this.gui .controller:last-child{border-bottom:none!important}.lil-this.gui .controller .name{color:#495057!important;font-weight:500!important;font-size:12px!important}.lil-this.gui .controller .widget{background:#f8f9fa!important;border:1px solid #ced4da!important;border-radius:4px!important;color:#495057!important}.lil-this.gui .controller .widget:focus,.lil-this.gui .controller .widget:hover{border-color:#80bdff!important;-webkit-box-shadow:0 0 0 2px rgba(0,123,255,.25)!important;box-shadow:0 0 0 2px rgba(0,123,255,.25)!important}.lil-this.gui .controller .widget:focus{outline:none!important}.lil-this.gui .controller input[type=range]{background:#e9ecef!important;height:4px!important;-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important;border-radius:2px!important}.lil-this.gui .controller.number .fill{border-right:solid #008de9}.lil-this.gui .controller input[type=range]::-webkit-slider-thumb{background:#007bff!important;border:2px solid #fff!important;-webkit-box-shadow:0 2px 4px rgba(0,0,0,.2)!important;box-shadow:0 2px 4px rgba(0,0,0,.2)!important;width:16px!important;height:16px!important;border-radius:50%!important;-webkit-appearance:none!important;appearance:none!important;cursor:pointer!important}.lil-this.gui .controller input[type=range]::-moz-range-thumb{background:#007bff!important;border:2px solid #fff!important;box-shadow:0 2px 4px rgba(0,0,0,.2)!important;width:16px!important;height:16px!important;border-radius:50%!important;cursor:pointer!important}.lil-this.gui .controller .option{background:#fff!important;color:#495057!important;border-bottom:1px solid #f1f3f4!important}.lil-this.gui .controller .option:hover{background:#f8f9fa!important}.lil-this.gui .controller .option:last-child{border-bottom:none!important}.lil-this.gui input:active{background:#e6eff4}.lil-this.gui .controller button{background:linear-gradient(135deg,#007bff,#0056b3)!important;color:#fff!important;border:none!important;border-radius:4px!important;font-weight:500!important;-webkit-transition:all .2s ease!important;transition:all .2s ease!important}.lil-this.gui .controller button:hover{background:linear-gradient(135deg,#0056b3,#004085)!important;-webkit-transform:translateY(-1px)!important;transform:translateY(-1px)!important;-webkit-box-shadow:0 4px 8px rgba(0,123,255,.3)!important;box-shadow:0 4px 8px rgba(0,123,255,.3)!important}.lil-this.gui .controller .color{border:2px solid #fff!important;border-radius:4px!important;-webkit-box-shadow:0 2px 4px rgba(0,0,0,.1)!important;box-shadow:0 2px 4px rgba(0,0,0,.1)!important}.lil-this.gui .controller.number .slider,.lil-this.gui .controller.number .slider:hover{background-color:#e6eff4}.lil-this.gui input,.lil-this.gui input:hover,.lil-this.gui input[type=number]:focus,.lil-this.gui input[type=text]:focus{background:#e6eff4}.lil-this.gui .controller>.name{min-width:25px}.lil-this.gui .controller.number input{color:#2e3136}.lil-this.gui .controller.number .slider:active{background-color:#e6eff4}.lil-this.gui .folder>.title{background:linear-gradient(135deg,#f1f3f4,#e9ecef)!important;color:#495057!important;border-bottom:1px solid #dee2e6!important}.lil-this.gui .folder>.title:before{color:#6c757d!important}.lil-this.gui .folder.closed>.children{display:none!important}#konva-container[data-v-0f76e7f4]{z-index:3;width:100%;height:100%;cursor:pointer;overflow:hidden}span[data-v-f547d5c6]{font-weight:bolder}.text[data-v-f547d5c6]{margin-top:20px}.line[data-v-f547d5c6]{border-bottom:1px solid #dcdfe6;margin:20px 0}.center[data-v-f547d5c6]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.center .cen span[data-v-f547d5c6],.center .top span[data-v-f547d5c6]{color:"#53a8ff";display:inline-block;width:30px;height:30px;text-align:center;line-height:30px;border:1px solid;padding:5px;margin-bottom:10px;background-color:#e9f3ff}.center .cen span[data-v-f547d5c6]{margin:10px}.button[data-v-f547d5c6]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:end;margin-top:20px}@font-face{font-family:iconfont;src:url(//at.alicdn.com/t/font_3226805_qqvo3ag3r8.woff2?t=1646635700216) format("woff2"),url(//at.alicdn.com/t/font_3226805_qqvo3ag3r8.woff?t=1646635700216) format("woff"),url(//at.alicdn.com/t/font_3226805_qqvo3ag3r8.ttf?t=1646635700216) format("truetype")}.iconfont[data-v-f547d5c6]{font-family:iconfont!important;font-size:50px;font-style:normal;color:"#53a8ff";-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.icon-shubiao[data-v-f547d5c6]:before{content:""}.main_body[data-v-4b17bce0]{position:relative;width:100%;height:100%;-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden}.classification_title[data-v-4b17bce0]{margin:0 0 10px 0;color:#fff;font-size:14px;cursor:default}.toolbar[data-v-4b17bce0]{z-index:10;position:absolute;width:520px;padding:8px 16px;border-radius:6px;-webkit-box-shadow:0 2px 10px 0 rgba(6,29,44,.25);box-shadow:0 2px 10px 0 rgba(6,29,44,.25);background-color:#fff;top:10px;left:50%;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transform:translateX(-50%);transform:translateX(-50%);display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-pack:distribute;justify-content:space-around}.icon_toolbar[data-v-4b17bce0],.text_toolbar[data-v-4b17bce0]{float:left;width:32px;height:32px;padding:0!important;background-repeat:no-repeat;background-size:24px;background-position:50%}.icon_active[data-v-4b17bce0],.icon_toolbar[data-v-4b17bce0]:hover,.text_toolbar[data-v-4b17bce0]:hover{background-color:#eee}[data-v-4b17bce0].icon_color .el-color-picker__trigger{height:24px;margin-top:4px;width:24px!important}[data-v-4b17bce0].el-color-picker--medium,[data-v-4b17bce0].el-color-picker--medium .el-color-picker__trigger{width:24px!important;height:24px!important}.canvas_container[data-v-4b17bce0]{position:relative;width:100%;height:100%;overflow:auto;-webkit-box-sizing:border-box;box-sizing:border-box}.canvas_container canvas[data-v-4b17bce0]{position:absolute;left:0}.canvas_container #ctx_front[data-v-4b17bce0]{z-index:5;background-color:transparent}.canvas_container #ctx_back[data-v-4b17bce0]{z-index:3}.canvas_container #ctx_base[data-v-4b17bce0]{z-index:1}#text[data-v-4b17bce0]{position:absolute;z-index:-1;resize:none;outline:none;border:1px dashed #9c9c9c;overflow:hidden;background:transparent;line-height:30px;display:none}#text[data-v-4b17bce0]:hover{border:1px dashed #53a8ff}#svg-component[data-v-2572c0e2],#svg-tigger[data-v-2572c0e2]{cursor:pointer;height:100%;width:100%;position:relative}#toolbar-show[data-v-2572c0e2]{z-index:20;position:absolute;width:100%;height:100%;top:0;left:0;overflow:hidden;background:#fff}
+@charset "UTF-8";.fl-model-containor[data-v-7f8842df]{width:100%;height:100%;position:relative;cursor:pointer}[data-v-7f8842df] .tips-label{width:60px;color:#000;font:12px Helvetica;margin-top:-3em;padding:5px;text-align:center;vertical-align:middle;background-color:khaki}[data-v-7f8842df] .measure-label{max-width:100px;margin-top:-1em;border:10px;border-radius:5px;padding:3px 10px;cursor:pointer;color:#009bea;background-color:#f4f4f4;-webkit-box-shadow:0 1px 3px 1px rgba(0,0,0,.25);box-shadow:0 1px 3px 1px rgba(0,0,0,.25)}[data-v-7f8842df] .circle-tag{width:10px;height:10px;margin-top:5px;border-radius:50%;background-color:#ff5000}[data-v-7f8842df] .measure-label-font{word-break:break-all}[data-v-7f8842df] .mark-label-img{padding-top:5px;width:20px;height:20px}.loading-overlay[data-v-7f8842df]{position:absolute;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.7);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;z-index:1000;opacity:0;visibility:hidden;-webkit-transition:opacity .3s ease,visibility .3s ease;transition:opacity .3s ease,visibility .3s ease}.loading-overlay--visible[data-v-7f8842df]{opacity:1;visibility:visible}.loading-content[data-v-7f8842df]{background:#fff;border-radius:12px;padding:30px;text-align:center;-webkit-box-shadow:0 8px 32px rgba(0,0,0,.3);box-shadow:0 8px 32px rgba(0,0,0,.3);min-width:300px;max-width:400px}.loading-spinner[data-v-7f8842df]{width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid #409eff;border-radius:50%;-webkit-animation:spin-7f8842df 1s linear infinite;animation:spin-7f8842df 1s linear infinite;margin:0 auto 20px}@-webkit-keyframes spin-7f8842df{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin-7f8842df{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.loading-text[data-v-7f8842df]{font-size:16px;font-weight:500;color:#333;margin-bottom:20px}.loading-this.progress-bar[data-v-7f8842df]{width:100%;height:8px;background-color:#f0f0f0;border-radius:4px;overflow:hidden;margin-bottom:15px}.loading-this.progress-fill[data-v-7f8842df]{height:100%;background:-webkit-gradient(linear,left top,right top,from(#409eff),to(#67c23a));background:linear-gradient(90deg,#409eff,#67c23a);border-radius:4px;-webkit-transition:width .3s ease;transition:width .3s ease}.loading-details[data-v-7f8842df]{font-size:12px;color:#666;line-height:1.5}.lil-this.gui{background:hsla(0,0%,100%,.95)!important;border:1px solid #e0e0e0!important;border-radius:8px!important;-webkit-box-shadow:0 4px 12px rgba(0,0,0,.15)!important;box-shadow:0 4px 12px rgba(0,0,0,.15)!important;backdrop-filter:blur(10px)!important;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif!important}.lil-this.gui .title{background:linear-gradient(135deg,#f8f9fa,#e9ecef)!important;color:#495057!important;border-bottom:1px solid #dee2e6!important;font-weight:600!important;padding:0 12px!important;border-radius:8px 8px 0 0!important}.lil-this.gui .controller{border-bottom:1px solid #f1f3f4!important;background:transparent!important}.lil-this.gui .controller:last-child{border-bottom:none!important}.lil-this.gui .controller .name{color:#495057!important;font-weight:500!important;font-size:12px!important}.lil-this.gui .controller .widget{background:#f8f9fa!important;border:1px solid #ced4da!important;border-radius:4px!important;color:#495057!important}.lil-this.gui .controller .widget:focus,.lil-this.gui .controller .widget:hover{border-color:#80bdff!important;-webkit-box-shadow:0 0 0 2px rgba(0,123,255,.25)!important;box-shadow:0 0 0 2px rgba(0,123,255,.25)!important}.lil-this.gui .controller .widget:focus{outline:none!important}.lil-this.gui .controller input[type=range]{background:#e9ecef!important;height:4px!important;-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important;border-radius:2px!important}.lil-this.gui .controller.number .fill{border-right:solid #008de9}.lil-this.gui .controller input[type=range]::-webkit-slider-thumb{background:#007bff!important;border:2px solid #fff!important;-webkit-box-shadow:0 2px 4px rgba(0,0,0,.2)!important;box-shadow:0 2px 4px rgba(0,0,0,.2)!important;width:16px!important;height:16px!important;border-radius:50%!important;-webkit-appearance:none!important;appearance:none!important;cursor:pointer!important}.lil-this.gui .controller input[type=range]::-moz-range-thumb{background:#007bff!important;border:2px solid #fff!important;box-shadow:0 2px 4px rgba(0,0,0,.2)!important;width:16px!important;height:16px!important;border-radius:50%!important;cursor:pointer!important}.lil-this.gui .controller .option{background:#fff!important;color:#495057!important;border-bottom:1px solid #f1f3f4!important}.lil-this.gui .controller .option:hover{background:#f8f9fa!important}.lil-this.gui .controller .option:last-child{border-bottom:none!important}.lil-this.gui input:active{background:#e6eff4}.lil-this.gui .controller button{background:linear-gradient(135deg,#007bff,#0056b3)!important;color:#fff!important;border:none!important;border-radius:4px!important;font-weight:500!important;-webkit-transition:all .2s ease!important;transition:all .2s ease!important}.lil-this.gui .controller button:hover{background:linear-gradient(135deg,#0056b3,#004085)!important;-webkit-transform:translateY(-1px)!important;transform:translateY(-1px)!important;-webkit-box-shadow:0 4px 8px rgba(0,123,255,.3)!important;box-shadow:0 4px 8px rgba(0,123,255,.3)!important}.lil-this.gui .controller .color{border:2px solid #fff!important;border-radius:4px!important;-webkit-box-shadow:0 2px 4px rgba(0,0,0,.1)!important;box-shadow:0 2px 4px rgba(0,0,0,.1)!important}.lil-this.gui .controller.number .slider,.lil-this.gui .controller.number .slider:hover{background-color:#e6eff4}.lil-this.gui input,.lil-this.gui input:hover,.lil-this.gui input[type=number]:focus,.lil-this.gui input[type=text]:focus{background:#e6eff4}.lil-this.gui .controller>.name{min-width:25px}.lil-this.gui .controller.number input{color:#2e3136}.lil-this.gui .controller.number .slider:active{background-color:#e6eff4}.lil-this.gui .folder>.title{background:linear-gradient(135deg,#f1f3f4,#e9ecef)!important;color:#495057!important;border-bottom:1px solid #dee2e6!important}.lil-this.gui .folder>.title:before{color:#6c757d!important}.lil-this.gui .folder.closed>.children{display:none!important}#konva-container[data-v-cb260cfc]{z-index:3;width:100%;height:100%;cursor:pointer;overflow:hidden}span[data-v-f547d5c6]{font-weight:bolder}.text[data-v-f547d5c6]{margin-top:20px}.line[data-v-f547d5c6]{border-bottom:1px solid #dcdfe6;margin:20px 0}.center[data-v-f547d5c6]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.center .cen span[data-v-f547d5c6],.center .top span[data-v-f547d5c6]{color:"#53a8ff";display:inline-block;width:30px;height:30px;text-align:center;line-height:30px;border:1px solid;padding:5px;margin-bottom:10px;background-color:#e9f3ff}.center .cen span[data-v-f547d5c6]{margin:10px}.button[data-v-f547d5c6]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:end;margin-top:20px}@font-face{font-family:iconfont;src:url(//at.alicdn.com/t/font_3226805_qqvo3ag3r8.woff2?t=1646635700216) format("woff2"),url(//at.alicdn.com/t/font_3226805_qqvo3ag3r8.woff?t=1646635700216) format("woff"),url(//at.alicdn.com/t/font_3226805_qqvo3ag3r8.ttf?t=1646635700216) format("truetype")}.iconfont[data-v-f547d5c6]{font-family:iconfont!important;font-size:50px;font-style:normal;color:"#53a8ff";-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.icon-shubiao[data-v-f547d5c6]:before{content:""}.main_body[data-v-4b17bce0]{position:relative;width:100%;height:100%;-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden}.classification_title[data-v-4b17bce0]{margin:0 0 10px 0;color:#fff;font-size:14px;cursor:default}.toolbar[data-v-4b17bce0]{z-index:10;position:absolute;width:520px;padding:8px 16px;border-radius:6px;-webkit-box-shadow:0 2px 10px 0 rgba(6,29,44,.25);box-shadow:0 2px 10px 0 rgba(6,29,44,.25);background-color:#fff;top:10px;left:50%;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transform:translateX(-50%);transform:translateX(-50%);display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-pack:distribute;justify-content:space-around}.icon_toolbar[data-v-4b17bce0],.text_toolbar[data-v-4b17bce0]{float:left;width:32px;height:32px;padding:0!important;background-repeat:no-repeat;background-size:24px;background-position:50%}.icon_active[data-v-4b17bce0],.icon_toolbar[data-v-4b17bce0]:hover,.text_toolbar[data-v-4b17bce0]:hover{background-color:#eee}[data-v-4b17bce0].icon_color .el-color-picker__trigger{height:24px;margin-top:4px;width:24px!important}[data-v-4b17bce0].el-color-picker--medium,[data-v-4b17bce0].el-color-picker--medium .el-color-picker__trigger{width:24px!important;height:24px!important}.canvas_container[data-v-4b17bce0]{position:relative;width:100%;height:100%;overflow:auto;-webkit-box-sizing:border-box;box-sizing:border-box}.canvas_container canvas[data-v-4b17bce0]{position:absolute;left:0}.canvas_container #ctx_front[data-v-4b17bce0]{z-index:5;background-color:transparent}.canvas_container #ctx_back[data-v-4b17bce0]{z-index:3}.canvas_container #ctx_base[data-v-4b17bce0]{z-index:1}#text[data-v-4b17bce0]{position:absolute;z-index:-1;resize:none;outline:none;border:1px dashed #9c9c9c;overflow:hidden;background:transparent;line-height:30px;display:none}#text[data-v-4b17bce0]:hover{border:1px dashed #53a8ff}#svg-component[data-v-2572c0e2],#svg-tigger[data-v-2572c0e2]{cursor:pointer;height:100%;width:100%;position:relative}#toolbar-show[data-v-2572c0e2]{z-index:20;position:absolute;width:100%;height:100%;top:0;left:0;overflow:hidden;background:#fff}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fl-web-component",
-  "version": "2.1.1-beta.4",
+  "version": "2.1.1-beta.6",
   "scripts": {
     "postinstall": "patch-package",
     "tip1": "仅调试本组件不涉及业务组件,请执行dev",

package/packages/components/com-flcanvas/components/entityFormatting.js

@@ -33,7 +33,6 @@ function decimalToRGBHex(decimalValue) {
   };
 }
 export function handleFn(functionName, recordDxf, entity, group, key, configParams, konvaLayer) {
-  console.log(functionName);
 
   switch (functionName) {
     case 'LINE':
@@ -198,7 +197,7 @@ function mtextContentAndFormattingToTextAndStyle(textAndControlChars, entity, co
 function drawArc(recordDxf, entity, group, key, configParams) {
   let color = entity.color;
   let rgb = decimalToRGBHex(color);
-  console.log(rgb);
+  
   let hex = rgb.hex;
   let startAngle, endAngle;
   if (entity.type === 'CIRCLE') {
@@ -265,8 +264,7 @@ function drawEllpse(recordDxf, entity, group, key, configParams) {
     parseFloat(entity.majorAxisEndPoint.y),
     parseFloat(entity.majorAxisEndPoint.x)
   );
-  console.log(entity.startAngle);
-  console.log(entity.endAngle);
+
   let curve = new THREE.EllipseCurve(
     parseFloat(entity.center.x),
     parseFloat(entity.center.y),
@@ -316,7 +314,7 @@ function drawEllpse(recordDxf, entity, group, key, configParams) {
 function drawLine(recordDxf, entity, group, key, configParams) {
   let color = entity.color;
   let rgb = decimalToRGBHex(color);
-  console.log(rgb);
+  
   let hex = rgb.hex;
   let x1 = entity.vertices[0].x;
   let y1 = entity.vertices[0].y;
@@ -364,7 +362,7 @@ function drawLine(recordDxf, entity, group, key, configParams) {
 function drawText(recordDxf, entity, group, key, configParams) {
   let color = entity.color;
   let rgb = decimalToRGBHex(color);
-  console.log(rgb);
+  
   let hex = rgb.hex;
 
   if (hex == '#FFFFFF') {
@@ -466,13 +464,13 @@ function drawText(recordDxf, entity, group, key, configParams) {
 }
 
 function drawHatch(recordDxf, entity, group, key, configParams) {
-  console.log('hatch');
+
 }
 
 function drawLwLine(recordDxf, entity, group, key, configParams) {
   let color = entity.color;
   let rgb = decimalToRGBHex(color);
-  console.log(rgb);
+  
   let hex = rgb.hex;
 
   if (hex == '#FFFFFF') {

package/packages/components/com-flcanvas/index.vue

@@ -35,11 +35,17 @@ function downloadPDF(base64, fileName) {
   URL.revokeObjectURL(url); // 释放URL对象
 }
 import Konva from 'konva';
-import { Vector2 } from "three";
+import { Vector2 } from 'three';
 import DxfParser from 'dxf-parser';
 import DxfParser2 from '@/utils/dxf-parser/DxfParser';
 import jsPDF from 'jspdf';
-import { formatEntity, handleFn, centering, _GenerateArcVertices, _GenerateBulgeVertices } from './components/entityFormatting';
+import {
+  formatEntity,
+  handleFn,
+  centering,
+  _GenerateArcVertices,
+  _GenerateBulgeVertices,
+} from './components/entityFormatting';
 export default {
   name: 'Fl2dcanvas',
   components: {},
@@ -72,8 +78,8 @@ export default {
         this.konvaStage._resizeDOM();
       }
     });
-
     this.$nextTick(() => {
+      console.log(this.$refs.svgDraw.clientHeight)
       this.konvaStage = new Konva.Stage({
         className: 'stage',
         container: 'konva-container',
@@ -94,7 +100,6 @@ export default {
       var scaleBy = 1.1;
       //初始化缩放方法
       this.konvaStage.on('wheel', e => {
-        console.log(e);
         e.evt.preventDefault();
         var oldScale = this.konvaStage.scaleX();
         var pointer = this.konvaStage.getPointerPosition();
@@ -156,27 +161,42 @@ export default {
 
 */
 
-        const { scale, x, y } = this.calculateScaleAndPosition(
-          this.bounds,
-          this.konvaStage.width(),
-          this.konvaStage.height(),
-          0.05 // 5% 边距
-        );
+        // const { scale, x, y } = this.calculateScaleAndPosition(
+        //   this.bounds,
+        //   this.konvaStage.width(),
+        //   this.konvaStage.height(),
+        //   0.05 // 5% 边距
+        // );
 
-        this.konvaStage.position({ x: x, y: y });
-        this.konvaStage.scale({ x: scale, y: scale });
+        // this.konvaStage.position({ x: x, y: y });
+        // this.konvaStage.scale({ x: scale, y: scale });
 
-        this.konvaStage.batchDraw();
+        // this.konvaStage.batchDraw();
+        this.centerDraw();
       });
       this.konvaStage.on('click', e => {
         let target = this.konvaStage.mouseClickEndShape;
-        this.$emit('leftClick', target ? target.attrs : null)
+        this.$emit('leftClick', target ? target.attrs : null);
       });
     });
   },
   //销毁方法
 
   methods: {
+    // 图纸居中展示
+    centerDraw() {
+      const { scale, x, y } = this.calculateScaleAndPosition(
+        this.bounds,
+        this.konvaStage.width(),
+        this.konvaStage.height(),
+        0.05 // 5% 边距
+      );
+
+      this.konvaStage.position({ x: x, y: y });
+      this.konvaStage.scale({ x: scale, y: scale });
+
+      this.konvaStage.batchDraw();
+    },
     calculateScaleAndPosition(contentBounds, stageWidth, stageHeight, padding = 0.1) {
       // 1. 计算内容的实际宽高
       const contentWidth = contentBounds.maxX - contentBounds.minX;
@@ -219,7 +239,6 @@ export default {
 
       return { scale, x, y };
     },
-
     updateBounds(v) {
       if (this.bounds === null) {
         this.bounds = { minX: v.x, maxX: v.x, minY: v.y, maxY: v.y };
@@ -274,14 +293,11 @@ export default {
       for (let i = 0; i < hatchEntitys.length; i++) {
         let entity = hatchEntitys[i];
         let layerConfig = this.recordLayerConfig[entity.layer];
-        let configParams =
-          layerConfig && Object.keys(layerConfig).length > 0
-            ? layerConfig
-            : null;
-        let color = configParams ? configParams.color : "#000";
+        let configParams = layerConfig && Object.keys(layerConfig).length > 0 ? layerConfig : null;
+        let color = configParams ? configParams.color : '#000';
         let visible = configParams ? configParams.visible : true;
-        let name = entity.layer.replace(/\s*/g, "");
-        if (entity.type == "HATCH") {
+        let name = entity.layer.replace(/\s*/g, '');
+        if (entity.type == 'HATCH') {
           let boundaryLoops = entity.boundaryLoops;
           for (let j = 0; j < boundaryLoops.length; j++) {
             let list = [];
@@ -298,10 +314,7 @@ export default {
                   );
                   const axisRatio = entity.radius;
                   const yR = xR * axisRatio;
-                  const rotation = Math.atan2(
-                    majorAxisEndPoint.y,
-                    majorAxisEndPoint.x
-                  );
+                  const rotation = Math.atan2(majorAxisEndPoint.y, majorAxisEndPoint.x);
 
                   const arcVertices = _GenerateArcVertices({
                     vertices: [],
@@ -330,10 +343,8 @@ export default {
                     list.push(arcVertices[i].x);
                     list.push(-parseFloat(arcVertices[i].y));
                   }
-
                 }
                 if (entity.type == 1) {
-
                   list.push(entity.start.x);
                   list.push(-parseFloat(entity.start.y));
                   list.push(entity.end.x);
@@ -350,7 +361,7 @@ export default {
                   stroke: color,
                   customColor: color,
                   visible: visible,
-                  shapeType: 'hatch'
+                  shapeType: 'hatch',
                 });
                 this.konvaLayer.add(line);
               }
@@ -359,20 +370,14 @@ export default {
               let loop = boundaryLoops[0];
               if (loop.type == 7) {
                 let vertices = [];
-                for (
-                  let vtxIdx = 0;
-                  vtxIdx < loop.polyline.vertices.length;
-                  vtxIdx++
-                ) {
+                for (let vtxIdx = 0; vtxIdx < loop.polyline.vertices.length; vtxIdx++) {
                   const vtx = loop.polyline.vertices[vtxIdx];
                   if ((vtx.bulge ?? 0) == 0) {
                     vertices.push(new Vector2(vtx.x, vtx.y));
                   } else {
                     const prevVtx =
                       loop.polyline.vertices[
-                        vtxIdx == 0
-                          ? loop.polyline.vertices.length - 1
-                          : vtxIdx - 1
+                        vtxIdx == 0 ? loop.polyline.vertices.length - 1 : vtxIdx - 1
                       ];
                     if ((prevVtx.bulge ?? 0) == 0) {
                       /* Start vertex is not produced by _GenerateBulgeVertices(). */
@@ -380,16 +385,9 @@ export default {
                     }
                     const nextVtx =
                       loop.polyline.vertices[
-                        vtxIdx == loop.polyline.vertices.length - 1
-                          ? 0
-                          : vtxIdx + 1
+                        vtxIdx == loop.polyline.vertices.length - 1 ? 0 : vtxIdx + 1
                       ];
-                    vertices = _GenerateBulgeVertices(
-                      [],
-                      vtx,
-                      nextVtx,
-                      vtx.bulge
-                    );
+                    vertices = _GenerateBulgeVertices([], vtx, nextVtx, vtx.bulge);
                   }
                 }
                 let list = [];
@@ -408,7 +406,7 @@ export default {
                   stroke: color,
                   customColor: color,
                   visible: visible,
-                  shapeType: 'hatch'
+                  shapeType: 'hatch',
                 });
                 this.konvaLayer.add(line);
               }
@@ -447,7 +445,6 @@ export default {
           }
 
           if (group[0].stroke == undefined) {
-            console.log(group);
             group[0].stroke = '#000';
           }
           let customShape = new Konva.Shape({
@@ -558,6 +555,7 @@ export default {
       this.activedSvgPan.x = x;
       this.activedSvgPan.y = x;
       setTimeout(() => {
+        this.centerDraw();
         this.$emit('loaded');
       }, 100);
     },
@@ -670,9 +668,6 @@ export default {
           }
         }
 
-        console.log('bounds1');
-        console.log(_this.bounds1);
-
         for (let key in entities) {
           if (entities[key]) {
             let group = [];
@@ -702,7 +697,6 @@ export default {
             }
 
             if (group[0].stroke == undefined) {
-              console.log(group);
               group[0].stroke = '#000';
             }
 
@@ -774,8 +768,6 @@ export default {
           this.konvaStage.height(),
           0.05 // 5% 边距
         );
-        console.log('test1:');
-        console.log(this.bounds1);
 
         _this.bounds1 = null;
 
@@ -822,32 +814,38 @@ export default {
     // 更改图纸的色系 区分明暗两种 darkness 暗色系 bright 明亮
     setColorScheme(colorType) {
       // const backgroundColor = colorType === "darkness" ? "#000" : "transparent";
-      const color = colorType === "darkness" ? "#fff" : "#000";
+      const color = colorType === 'darkness' ? '#fff' : '#000';
       // konvaStage.container().style.background = backgroundColor;
-      this.konvaLayer.children.forEach((item) => {
+      this.konvaLayer.children.forEach(item => {
         this.traverseLayer(item, color);
       });
     },
-    
+
     traverseLayer(obj, color) {
       if (!obj.attrs.isGroup) {
         if (color === '#fff') {
-         let setColor = (obj.attrs.customColor === '#000' || obj.attrs.customColor === '#000000'|| obj.attrs.customColor === 'rgb(0, 0, 0)' || obj.attrs.customColor === 'rgba(0, 0, 0, 1)') ? color : obj.attrs.customColor
+          let setColor =
+            obj.attrs.customColor === '#000' ||
+            obj.attrs.customColor === '#000000' ||
+            obj.attrs.customColor === 'rgb(0, 0, 0)' ||
+            obj.attrs.customColor === 'rgba(0, 0, 0, 1)'
+              ? color
+              : obj.attrs.customColor;
           if (obj.attrs.shapeType === 'hatch' || obj.attrs.shapeType === 'text') {
             obj.setFill(setColor);
           }
           obj.setStroke(setColor);
-          obj.attrs.oldCustomColor = obj.attrs.customColor
-          obj.attrs.customColor = setColor
+          obj.attrs.oldCustomColor = obj.attrs.customColor;
+          obj.attrs.customColor = setColor;
         } else {
-          obj.attrs.customColor = obj.attrs.oldCustomColor
+          obj.attrs.customColor = obj.attrs.oldCustomColor;
           if (obj.attrs.shapeType === 'hatch' || obj.attrs.shapeType === 'text') {
             obj.setFill(obj.attrs.customColor);
           }
           obj.setStroke(obj.attrs.customColor);
         }
       } else {
-        obj.children.forEach((item) => {
+        obj.children.forEach(item => {
           this.traverseLayer(item, color);
         });
       }
@@ -855,7 +853,7 @@ export default {
   },
   beforeDestroy() {
     this.clearCache();
-  }
+  },
 };
 </script>
 <style lang="scss" scoped>