加载笔记内容...
加载笔记内容...
code:
1const { createWorker } = require('tesseract.js');
2
3const worker = await createWorker();
4
5(async () => {
6 await worker.loadLanguage('eng+chi_tra');
7 await worker.initialize('eng+chi_tra');
8 const { data: { text } } = await worker.recognize('https://tesseract.projectnaptha.com/img/eng_bw.png');
9 console.log(text);
10 await worker.terminate();
11})();搞不懂这个蠢东西，这样是优先使用 eng 来识别 建议这样用:
1import { LoggerService } from '@/common/logger/logger.service';
2import { Injectable } from '@nestjs/common';
3import type { OnModuleDestroy, OnModuleInit } from '@nestjs/common';
4import type Tesseract from 'tesseract.js';
5import type { ImageLike } from 'tesseract.js';
6import { createWorker } from 'tesseract.js';
7
8@Injectable()
9export class OCRService implements OnModuleInit, OnModuleDestroy {
10 private worker: Tesseract.Worker;
11
12 private engWorker: Tesseract.Worker;
13
14 private chsWorker: Tesseract.Worker;
15
16 constructor(private readonly logger: LoggerService) {
17 this.logger.setContext(OCRService.name);
18 }
19
20 async onModuleInit() {
21 this.worker = await createWorker();
22 this.engWorker = await createWorker();
23 this.chsWorker = await createWorker();
24 await this.worker.loadLanguage('chi_sim+eng');
25 await this.worker.initialize('chi_sim+eng');
26 await this.engWorker.loadLanguage('eng');
27 await this.engWorker.initialize('eng');
28 await this.chsWorker.loadLanguage('chi_sim');
29 await this.chsWorker.initialize('chi_sim');
30 }
31
32 async onModuleDestroy() {
33 await this.worker.terminate();
34 await this.engWorker.terminate();
35 await this.chsWorker.terminate();
36 }
37
38 async recognize(url: ImageLike) {
39 const result = await this.worker.detect(url);
40 const { script } = result.data;
41 if (script === 'Han') {
42 const res = await this.chsWorker.recognize(url);
43 return res.data;
44 }
45 const res = await this.engWorker.recognize(url);
46 return res.data;
47 }
48}在Web开发中，HTML元素的双击可能会导致周围的文本或元素被选中。这是由浏览器的默认行为引起的。下面的解释将探讨这一现象，并提供可能的解决方案。
现象分析： 在浏览器环境中，双击事件通常与文本选择行为关联。当用户双击某个元素时，浏览器可能会自动选择该元素的文本内容或其周围的元素。
解决方案： 为了避免这一不必要的选择行为，可以通过设置CSS属性或使用JavaScript来阻止这一默认行为。
使用CSS：可以通过设置user-select属性来禁止文本选择：
1.no-select {
2 user-select: none; /* 标准语法 */
3 -webkit-user-select: none; /* Safari 和 Chrome */
4 -moz-user-select: none; /* Firefox */
5 -ms-user-select: none; /* IE 10+ */
6}使用JavaScript：也可以通过捕获dblclick事件并调用event.preventDefault()方法来阻止默认选择行为：
1element.addEventListener('dblclick', function(event) {
2 event.preventDefault();
3});注意事项：
总之，HTML元素的双击导致周围元素被选中是浏览器的默认行为。通过合适的设计和编程技术，可以按需禁用或控制这一行为，从而提供更精确的用户交互体验。
<input type="color"> 是HTML5中的一个表单输入元素，用于允许用户通过图形化界面选择一个颜色。该元素生成一个颜色选择器小部件，在不同的浏览器和操作系统中其外观可能会有所不同。用户通过该颜色选择器可以选择特定的颜色值，这些值通常以#RRGGBB的十六进制格式返回。
在使用方面，这个元素通常用于个性化设置、图表可视化或任何需要用户界面与颜色交互的应用场景。例如，如果一个网页允许用户自定义主题颜色，<input type="color"> 元素将是一个合适的选择。
从技术角度讲，该元素可以通过JavaScript和CSS进一步自定义或样式化。以下是一个基础的HTML例子：
1<label for="favcolor">选择一个颜色：</label>
2<input type="color" id="favcolor" name="favcolor" value="#ff0000">在这个例子中，value属性是可选的，用于设置初始颜色。如果不设置，默认通常是#000000（黑色）。
值得注意的是，尽管<input type="color">在现代浏览器中广泛支持，但它不是所有浏览器都完全支持的特性，特别是一些较旧的或者非主流的浏览器。
总体来说，<input type="color">提供了一种标准化但可自定义的方式，以便在web应用中方便地实现颜色选择功能。然而，如果有更复杂的需求，例如颜色空间的高级控制或自定义颜色选择器界面，开发者可能需要利用JavaScript库或自定义解决方案。