编辑

Question

我正在为OCR构建一个小应用程序。

取决于图像，有时teseract需要一些时间来计算。在花费时间的同时，我想添加一个微调器，说明加载或计算算法。

这是我的代码的简化摘录：

---
title : app demo
author : yeshipants
output : 
  flexdashboard::flex_dashboard:
    orientation: rows
    self_contained : TRUE
    source_code: embed
runtime: shiny
---

```{r setup}
knitr::opts_chunk$set(cache = FALSE)
```


```{r loadPackages}
setwd("C:/Users/y_bho/Desktop/Training/OCR")
library(magick)
library(tesseract)
```

Column {.sidebar data-width=350}
-------------------------------------
### Input & Parameters
```{r inputImages, cache = TRUE}

selectInput("imagesToChoose", 
            label = "Choose an image to process",
            choices = c("Language example 1", 
                        "Language example 2",
                        "Jounal example"),
            selected = "Language example 1") 
```

Row {.tabset}
-------------------------------------  

### Image
```{r displayImage, cache = FALSE}    
renderImage({      
  if (input$imagesToChoose == "Language example 1"){
    list(src = "images/receipt.png", height = 240, width = 300)
  }
  else if(input$imagesToChoose == "Language example 2"){
    list(src = "images/french.JPG", height = 240, width = 300)
  }
  else if(input$imagesToChoose == "Jounal example"){
    list(src = "images/journal.jpg", height = 240, width = 300)
  }    
}, deleteFile = FALSE)

```

### OCR
```{r}
# load the dictionary

imageInput <- reactive({
 if (input$imagesToChoose == "Language example 1"){
    x = "images/receipt.png"
  }
  else if(input$imagesToChoose == "Language example 2"){
    x = "images/french.JPG"
  }
  else if(input$imagesToChoose == "Jounal example"){
    x = "images/journal.jpg"
  }
  return(x)
})

eng <- tesseract("eng")

text <- reactive({
  tesseract::ocr(imageInput(), engine = eng)
})

renderPrint({
  cat(text())
})

```

基本上，在用户选择不同的图像之间，我想显示“正在加载”，直到tesseract在代码底部的反应式功能上工作为止。

我在this repo中看到了繁忙指示器busyIndicator（wait = 1000）但是，首先，该软件包未下载，其次，我不知道将其放置在何处，尤其是在flexdashboard中。

编辑

始终保留从cat（text（））获得的输出。例;如果我想在以下收据上执行OCR：

我需要此输出（以逐行捕获信息）：

Answer 1

以下是带有繁忙指示器微调板的Flexdashboard的示例：

---
title: "Untitled"
output: 
  flexdashboard::flex_dashboard:
    orientation: rows
    includes: 
      after_body: "busy.html"
runtime: shiny
---

```{r setup, include=FALSE}
library(flexdashboard)
```

Column {.sidebar}
-----------------------------------------------------------------------

Waiting time between eruptions and the duration of the eruption for the
Old Faithful geyser in Yellowstone National Park, Wyoming, USA.

```{r}
selectInput("n_breaks", label = "Number of bins:",
            choices = c(10, 20, 35, 50), selected = 20)

sliderInput("bw_adjust", label = "Bandwidth adjustment:",
            min = 0.2, max = 2, value = 1, step = 0.2)
```

Column
-----------------------------------------------------------------------

### Geyser Eruption Duration

```{r}
plotOutput("plot")
output[["plot"]] <- renderPlot({
  Sys.sleep(5) # simulates a time-consuming task
  hist(faithful$eruptions, probability = TRUE, breaks = as.numeric(input$n_breaks),
       xlab = "Duration (minutes)", main = "Geyser Eruption Duration")
  dens <- density(faithful$eruptions, adjust = input$bw_adjust)
  lines(dens, col = "blue")
})
```

文件 busy.html ，位于同一文件夹中：

<style>
  .busy { 
    position: fixed;
    z-index: 1000;
    top: 50%;
    left: 50%;
    margin-top: -100px;
    margin-left: -50px;
    display: none;
    background-color: rgba(230,230,230,.8);
    text-align: center;
    padding-top: 20px;
    padding-left: 30px;
    padding-bottom: 40px;
    padding-right: 30px;
    border-radius: 5px;
  }
</style>

<script>
  $(document).ready(function(){
    $("#plot").on("shiny:recalculating", function(e){
      $(".busy").show();
    }).on("shiny:recalculated", function(e){
      $(".busy").hide();
    });
  });
</script>

<div class = "busy">
  <img src = "https://loading.io/spinners/comets/lg.comet-spinner.gif"/>
</div>

因此，对于您的情况，我会尝试类似的操作（我没有尝试过）：

```{r}
# load the dictionary
imageInput <- reactive({
 if (input$imagesToChoose == "Language example 1"){
    x = "images/receipt.png"
  }
  else if(input$imagesToChoose == "Language example 2"){
    x = "images/french.JPG"
  }
  else if(input$imagesToChoose == "Jounal example"){
    x = "images/journal.jpg"
  }
  return(x)
})

output[["tesseract"]] <- renderPrint({
  eng <- tesseract("eng")
  tesseract::ocr(imageInput(), engine = eng)
})

textOutput("tesseract")
```

，然后在 busy.html 中，将脚本替换为：

<script>
  $(document).ready(function(){
    $("#tesseract").on("shiny:recalculating", function(e){
      $(".busy").show();
    }).on("shiny:recalculated", function(e){
      $(".busy").hide();
    });
  });
</script>

（并且不要忘记YAML标头中的after_body: "busy.html"）。

编辑

我现在已经尝试过您的flexdashboard。如果要使用无功导体text：

eng <- tesseract("eng")

text <- reactive({
  tesseract::ocr(imageInput(), engine = eng)
})

output[["tesseract"]] <- renderPrint({
  cat(text())
})
textOutput("tesseract")

那最好去做：

<script>
  $(document).ready(function(){
    $("#tesseract").on("shiny:outputinvalidated", function(e){
      $(".busy").show();
    }).on("shiny:recalculated", function(e){
      $(".busy").hide();
    });
  });
</script>

R Flexdashboard OCR中的Shiny忙碌微调器

1 个答案:

编辑