Skip to main content

Displaying our "R - Quality Control Individual Range Chart Made Nice" inside a Java web App using AJAX - How To.



  • Prerequisites:
  • Once you are ready with all mentioned above, it is important you are able to generate the html file on your computer from the RMarkdown file provided on the github repository( https://github.com/LaranIkal/R-ANALYTICS ) mentioned above by using RStudio.
    • Download the zip file: R-ANALYTICS-master.zip
    • Unzip it to a local folder.
    • Double-click on file: R-ANALYTICS.Rproj, it will start rstudio.
    • On the right-below pane, click on files, you will see your files, click on file name: QualityControl_IndividualRangeChart.Rmd, rstudio will open the file:
    • To generate the html file from the Rmarkdown file, click on Knit->Knit to HTML.
    • Now you should be able to see your Intermediate Range Chart html file, like this:


- Now you must be able to generate the html file from command line, if you are on windows, the command would be like this:
"C:\Program Files\R\R-3.5.1\bin\Rscript" -e "rmarkdown::render('C:/Development/R/R-ANALYTICS/QualityControl_IndividualRangeChart.Rmd')"

Maybe the path to Rscript and the path to the Rmd file is different, just change it as you have it on your computer.

Note. It is important to note that this project was created using Windows 10 and it works on a Windows server as well.

- The next step is to get the files from master repository on github: https://github.com/LaranIkal/rchart.git, or you can also go directly to: https://github.com/LaranIkal/rchart and download the zip file, it will download a file called: rchart-master.zip 

  • Creating the project in eclipse EE IDE:
    • Using your file explorer, create a folder called rchart inside your eclipse EE workspace folder.
    • Open file rchart-master.zip
    • Extract the content of rchart-master folder inside the zip file into the new rchart folder you just created. 
    • Start Eclipse EE IDE and go to File-New-Java Project:.

    • Enter the name of the project as rchart and click Finish:

    • Once the project has been added, open it and double click on your pom.xml file to edit the Tomcat path according to your Tomcat path and save your changes:

    • Right-Click on your pom.xml file and Select Run As -> Maven build:
    • When Eclipse asks to edit the launch configuration, enter eclipse:eclipse as the Goals and click Run:
This will update all dependencies for the project.
    • Now let's create the war file, Right-Click on your pom.xml file and Select Run As -> Maven install:

This should generate a war file under your Tomcat installation folder/webapps, when you run the file Tomcat installation folder/bin/startup.bat, the war file must be expanded, so you will see something like this:


    • Go to your web browser and point it to http://localhost:8080/RChartFromJava, verify the Rscript path and set it accordingly - "C:\\Program Files\\R\\R-3.5.1\\bin\\Rscript" - and click on the Display Chart button, now you should be able to see the Intermediate Range Chart of the data in the text area:


How is it working?:

- When you point your web browser to: http://localhost:8080/RChartFromJava, the MainController Java file sends the homepage.html template to the browser, the homepage.html loads the Javascript file DisplayChart.js under folder rchart\src\main\resources\static

- When you click the Display Chart button, it runs the Javascript code because it is configured in this way in the template: <input type="button" VALUE="Display Chart"
onclick='JavaScript:xmlhttpPostScriptData( "DisplayChart", this.form, "iframeChartDisplay", "Display Chart" )'>, the Javascript code posts the data to the Java backend app using Ajax and keeps waiting for response.

-  The MainController in the Java backend app receives the data and opens the RMarkdown template under folder: rchart\src\main\resources\static\ChartTemplates, it replaces the values and creates a temporary RMarkdown document, then it process the RMarkdown temporary document to create the html document, opens the html file and return it as string to the web browser.

If you have any questions, I might help you if you let a comment in this article.

Enjoy it!!!.

Carlos Kassab
https://www.linkedin.com/in/carlos-kassab-48b40743/

More information about R:
https://www.r-bloggers.com


Popular posts from this blog

UPDATED: Using R and H2O to identify product anomalies during the manufacturing process.

Note.  This is an update to article:  http://laranikalranalytics.blogspot.com/2019/03/using-r-and-h2o-to-identify-product.html - It has some updates but also code optimization from  Yana Kane-Esrig(  https://www.linkedin.com/in/ykaneesrig/ ) , as she mentioned in a message: The code you posted has two nested for() {} loops. It took a very long time to run. I used just one for() loop. It was much faster   Here her original code: num_rows=nrow(allData) for(i in 1:ncol(allData)) {   temp = allData [,i]   cat( "Processing column:", i, ", number missing:", sum( is.na(temp)), "\n" )    temp_mising =is.na( allData[, i])    temp_values = allData[,i][! temp_mising]    temp_random = sample(temp_values, size = num_rows, replace = TRUE)      temp_imputed = temp   temp_imputed[temp_mising]= temp_random [temp_mising]   # describe(temp_imputed)   allData [,i] = temp_imputed      cat( "Process...
Read more

Installing our R development environment on Ubuntu 20.04

  Step 1: Install R,  Here the link with instructions:  How to instal R on Ubuntu 20.04 Adding the steps I followed because sometimes the links become unavailable: Add GPG key: $ sudo apt-key adv --keyserver keyserver.ubuntu.com --recv-keys E298A3A825C0D65DFD57CBB651716619E084DAB9 Output: Executing: /tmp/apt-key-gpghome.NtZgt0Un4R/gpg.1.sh --keyserver keyserver.ubuntu.com --recv-keys E298A3A825C0D65DFD57CBB651716619E084DAB9 gpg: key 51716619E084DAB9: public key "Michael Rutter " imported gpg: Total number processed: 1 gpg: imported: 1 Add repository: $ sudo add-apt-repository 'deb https://cloud.r-project.org/bin/linux/ubuntu focal-cran40/' Output: Hit:1 https://deb.opera.com/opera-stable stable InRelease Hit:2 http://us.archive.ubuntu.com/ubuntu focal InRelease Hit:3 http://archive.canonical.com/ubuntu focal InRelease ...
Read more

Using R and H2O Isolation Forest anomaly detection for data quality, further analysis.

Introduction: This is the second article on data quality, for the first part, please go to:  http://laranikalranalytics.blogspot.com/2019/11/using-r-and-h2o-isolation-forest-for.html Since Isolation Forest is building an ensemble of isolation trees, and these trees are created randomly, there is a lot of randomness in the isolation forest training, so, to have a more robust result, 3 isolation forest models will be trained for a better anomaly detection. I will also use Apache Spark for data handling. For a full example, testing data will be used after training the 3 IF(Isolation Forest) models. This way of using Isolation Forest is kind of a general usage also for maintenance prediction. I am working with data from file: https://www.kaggle.com/bradklassen/pga-tour-20102018-data NOTE: There was a problem with the data from the link above, so I created some synthetic data that can be downloaded from this link:  Golf Tour Synthetic Data # Set Java parameters, en...
Read more