新增默认的优化显示效果

src/App.vue

@@ -3,7 +3,11 @@
     <select-file accept=".cfdat" button-type="primary" @change="loadCFData"
       >导入CFDATA</select-file
     >
-    <el-button @click="stopThread">停止优化</el-button>
+    <el-button @click="stop">停止优化</el-button>
+    <div>
+      <canvas ref="canvas" width="1220" height="770" ></canvas>
+    </div>
+    
   </div>
 </template>
 
@@ -16,8 +20,10 @@ import * as fileHelper from "@/Business/FileHelper";
 // import iconv from "iconv-lite";
 import { BlockConvert } from "./Business/BlockConvert";
 import { LayoutEngine } from "./Business/LayoutEngine";
+import { BlockView } from './Business/BlockView';
 
-let engine: { stopThread: () => void };
+let engine: LayoutEngine;
+let blockView: BlockView
 
 export default Vue.extend({
   name: "app",
@@ -33,6 +39,7 @@ export default Vue.extend({
   },
   mounted() {
     document.title = "开料调试工具 - " + document.title;
+    blockView = new BlockView(this.$refs.canvas);
   },
   methods: {
     /**读取文件 */
@@ -44,7 +51,7 @@ export default Vue.extend({
     newLayout(planJson: string) {
       const plan = JSON.parse(planJson);
       console.log(plan);
-      const engine = new LayoutEngine();
+      engine = new LayoutEngine();
       const blockConvert = new BlockConvert();
       const parts = [];
       for (const block of plan["BlockList"]) {
@@ -56,8 +63,9 @@ export default Vue.extend({
       // engine.run();
       engine.startThread();
     },
-    stopThread() {
+    stop() {
       engine.stopThread();
+      blockView.update(engine.board,engine.result.Parts);
     }
   }
 });

src/Business/BlockConvert.ts

@@ -1,19 +1,25 @@
 import { Path } from '../Nest/Core/Path';
 import { Part } from '../Nest/Core/Part';
+
+let autoId:number = 0 
 export class BlockConvert{
     /**
      *
      */
     constructor() {
         // super();
+        this.init();
+    }
 
+    init(){
+        autoId = 0;
     }
     createPart(data:any,board:Path){
-        let id = data['BlockID'];
+        // let id = data['BlockID'];
         let width = data['Width'];
         let height = data['Length'];
         let part = new Part();
-        part.Id = id;
+        part.Id = autoId++;
         part.Init(new Path([{ x: 0, y: 0 }, { x: width, y: 0 }, { x: width, y: height }, { x: 0, y: height }]),board);
         part.UserData = data;
         return part;

src/Business/BlockView.ts

@@ -1,11 +1,36 @@
-export class BlockView{
-    /**
-     *
-     */
-    constructor(canvas:HTMLCanvasElement) {
+import { Part } from '@/Nest/Core/Part';
+import { Path } from '@/Nest/Core/Path';
+import { Point } from '@/Nest/Common/Point';
 
+export class BlockView {
+    ctx: CanvasRenderingContext2D
+    constructor(canvas: HTMLCanvasElement) {
+        this.ctx = canvas.getContext('2d');
     }
-    drawBlock(){
+    update(board: Path, list: Part[]) {
+        this.ctx.scale(0.5, 0.5);
 
+        // this.ctx.rect(0,0,1220,2440);
+        // this.ctx.stroke();
+        this.drawPath(board);
+
+        for (const part of list) {
+            // console.log('parts',part);
+            this.drawPath(part.RotatedStates[part.StateIndex].Contour,{x:part.PlacePosition.x/10000,y:part.PlacePosition.y/10000});
+
+        }
     }
+
+    private drawPath(path: Path, place: Point = { x: 0, y: 0 }) {
+        
+        this.ctx.beginPath();
+        this.ctx.moveTo(path.Points[0].x+place.x, path.Points[0].y+place.y);
+        for (const point of path.Points) {
+            this.ctx.lineTo(point.x+place.x, point.y+place.y)
+        }
+        this.ctx.closePath();
+        this.ctx.stroke();
+    }
+
+
 }

src/Business/LayoutEngine.ts

@@ -1,19 +1,21 @@
 import { Part } from '../Nest/Core/Part';
 import { Path } from '../Nest/Core/Path';
-import { DefaultBin } from '../Nest/Core/DefaultBin';
+// import { DefaultBin } from '../Nest/Core/DefaultBin';
 import { PathGeneratorSingle } from '../Nest/Core/PathGenerator';
 import { NestCache } from '../Nest/Core/NestCache';
 import { NestDatabase } from '../Nest/Core/NestDatabase';
 import { NestFiler } from '../Nest/Common/Filer';
 import { OptimizeMachine } from '../Nest/Core/OptimizeMachine';
 import { Individual } from '../Nest/Core/Individual';
-import Worker from "../Nest/Core/OptimizeWorker.worker";
+import Worker from "worker-loader!../Nest/Core/OptimizeWorker.worker";
 import { InitClipperCpp } from '../Nest/Common/ClipperCpp';
+import { NestHelper } from './NestHelper';
 
 export class LayoutEngine {
     parts: Part[] = [];
     board: Path;
     threads: Worker[] = [];
+    result: Individual;
     /**
      *
      */
@@ -22,10 +24,10 @@ export class LayoutEngine {
         //清理缓存,这个缓存是全局的
         PathGeneratorSingle.Clear();
         NestCache.Clear();
-        DefaultBin.InsideNFPCache = {};
+        // DefaultBin.InsideNFPCache = {};
 
         //注册bin
-        let binPath = DefaultBin;
+        let binPath = NestHelper.createRect(2440,1220);
         // binPath.Id = undefined; //清除这个缓存
         PathGeneratorSingle.RegisterId(binPath);
 
@@ -59,7 +61,7 @@ export class LayoutEngine {
         let db = new NestDatabase();
         db.Paths = PathGeneratorSingle.paths;
         db.Parts = this.parts;
-        db.Bin = DefaultBin
+        db.Bin = this.board
 
         let f = new NestFiler();
         db.WriteFile(f);//写入到文件中
@@ -75,6 +77,7 @@ export class LayoutEngine {
             if (best <= inv.Fitness)
                 return;
             best = inv.Fitness;
+            this.result = inv;
             let text = `优化率:${inv.Fitness}`;
             console.log(text);
         };
@@ -82,7 +85,8 @@ export class LayoutEngine {
 
     }
 
-    async stopThread() {
+    stopThread() {
+        console.log('worker',this.threads[0]);
         this.threads[0].terminate()
     }
 }

src/Business/NestHelper.ts

@@ -0,0 +1,7 @@
+import { Path } from '@/Nest/Core/Path';
+
+export class NestHelper{
+    static createRect(width:number,height:number){
+        return new Path([{ x: 0, y: 0 }, { x: width, y: 0 }, { x: width, y: height }, { x: 0, y: height }]);
+    }
+}

src/shims-worker.d.ts

@@ -0,0 +1,9 @@
+declare module "worker-loader!*" {
+    class WebpackWorker extends Worker {
+      constructor();
+    }
+  
+    export = WebpackWorker;
+  }
+  
+  declare module '*.json'

vue.config.js

@@ -13,19 +13,17 @@ module.exports = {
       globalObject: "this",
     },
   },
-  chainWebpack(config) {
-    let  tsRule = config.module
-    .rule("ts").uses;
-    config.module
-      .rule("worker")
-      .test(/\.worker\.ts$/i)
-      .use("worker-loader")
-      .loader("worker-loader").end()
-      .use("ts-loader")
-      .loader("ts-loader").options({
-        transpileOnly: true,
-        happyPackMode: false
-      }).end();
+  chainWebpack(config) {;
+    // config.module
+    //   .rule("worker")
+    //   .test(/\.worker\.ts$/i)
+    //   .use("worker-loader")
+    //   .loader("worker-loader").end()
+    //   .use("ts-loader")
+    //   .loader("ts-loader").options({
+    //     transpileOnly: true,
+    //     happyPackMode: false
+    //   }).end();
     config.module
       .rule("fonts")
       .use("url-loader")