Difference between revisions of "S-MALL Application"

From Visual Analytics and Applications
Jump to navigation Jump to search
 
(37 intermediate revisions by 3 users not shown)
Line 5: Line 5:
 
</div>
 
</div>
 
{|style="background-color:#565656;" width="100%" cellspacing="0" cellpadding="0" valign="top" border="0"  |  
 
{|style="background-color:#565656;" width="100%" cellspacing="0" cellpadding="0" valign="top" border="0"  |  
−
| style="font-family:Century Gothic; font-size:100%; solid #000000; background:#565656; text-align:center;" width="20%" |   
+
| style="font-family:Century Gothic; font-size:100%; solid #000000; background:#565656; text-align:center;" width="25%" |   
 
;  
 
;  
 
[[S-MALL_Overview| <font color="#FFFFF">Overview</font>]]  
 
[[S-MALL_Overview| <font color="#FFFFF">Overview</font>]]  
 
   
 
   
−
| style="font-family:Century Gothic; font-size:100%; solid #1B338F; background:#565656; text-align:center;" width="20%" |   
+
| style="font-family:Century Gothic; font-size:100%; solid #1B338F; background:#2e5b84; text-align:center;" width="25%" |   
 
;  
 
;  
−
[[S-MALL_Proposal| <font color="#FFFFFF">Proposal</font>]]  
+
[[S-MALL_Application| <font color="#FFFFFF">Application</font>]]  
 
   
 
   
−
| style="font-family:Century Gothic; font-size:100%; solid #1B338F; background:#002060; text-align:center;" width="20%" |   
+
| style="font-family:Century Gothic; font-size:100%; solid #1B338F; background:#565656; text-align:center;" width="25%" |   
 
;  
 
;  
−
[[S-MALL_Application| <font color="#FFFFFF">Application</font>]]  
+
[[S-MALL_User Guide| <font color="#FFFFFF">User Guide</font>]]  
 
   
 
   
−
| style="font-family:Century Gothic; font-size:100%; solid #1B338F; background:#565656; text-align:center;" width="20%" |   
+
| style="font-family:Century Gothic; font-size:100%; solid #1B338F; background:#565656; text-align:center;" width="25%" |   
 
;  
 
;  
 
[[S-MALL_Poster| <font color="#FFFFFF">Poster</font>]]  
 
[[S-MALL_Poster| <font color="#FFFFFF">Poster</font>]]  
−
 
−
| style="font-family:Century Gothic; font-size:100%; solid #1B338F; background:#565656; text-align:center;" width="20%" | 
 
−
;
 
−
[[S-MALL_Reports| <font color="#FFFFFF">Reports</font>]]
 
 
   
 
   
 
|  &nbsp;  
 
|  &nbsp;  
Line 31: Line 27:
 
<table width=100%>
 
<table width=100%>
 
<tr>
 
<tr>
−
<td align="center"><font size = 2><span style="font-family:Century Gothic;"><b>Movement Analysis</b></span></font></td>
+
<td align="center"><font size = 2><span style="font-family:Century Gothic;"><b>[https://smartcafe.shinyapps.io/s-mall1-movement_analysis/ Movement Analysis]</b></span></font></td>
−
<td align="center"><font size = 2><span style="font-family:Century Gothic;"><b>Member Analysis</b></span></font></td>
+
<td align="center"><font size = 2><span style="font-family:Century Gothic;"><b>[https://smartcafe.shinyapps.io/s-mall2-members_analysis/ Member Analysis]</b></span></font></td>
−
<td align="center"><font size = 2><span style="font-family:Century Gothic;"><b>Association Analysis</b></span></font></td>
+
<td align="center"><font size = 2><span style="font-family:Century Gothic;"><b>[https://smartcafe.shinyapps.io/s-mall3-association_rules/ Association Analysis]</b></span></font></td>
 
</tr>
 
</tr>
 
</table>
 
</table>
Line 40: Line 36:
  
 
<br>
 
<br>
 +
 
== APPLICATION DESCRIPTION ==
 
== APPLICATION DESCRIPTION ==
 
Part1: Movement Analysis
 
Part1: Movement Analysis
Line 45: Line 42:
 
|-
 
|-
 
! scope="col" style="width: 20%; font-family:Century Gothic;"| Visualization
 
! scope="col" style="width: 20%; font-family:Century Gothic;"| Visualization
−
! scope="col" style="width: 30%; font-family:Century Gothic;"| Methodology & Technique
+
! scope="col" style="width: 40%; font-family:Century Gothic;"| Methodology & Technique
−
! scope="col" style="width: 30%; font-family:Century Gothic;"| Usage
+
! scope="col" style="width: 40%; font-family:Century Gothic;"| Usage
 
|-
 
|-
−
! scope="row"| insert image of line chart
+
! scope="row" style="background: #ffffff;"|
 +
[[File:T3 Trellis.JPG|center|300px]]
 
|  
 
|  
 
<ul>
 
<ul>
 
<li>Chart type: Line chart & trellis plot</li>
 
<li>Chart type: Line chart & trellis plot</li>
−
<li>R Package: ggplot2, plotly</li>
+
<li>R Package: [https://cran.r-project.org/web/packages/ggplot2/index.html ggplot2], [https://cran.r-project.org/web/packages/plotly/index.html plotly]</li>
 
<li>Interactivity: Use selectInput to control plot and segment by different timelevels, eg. Date, day of week, and hour</li>
 
<li>Interactivity: Use selectInput to control plot and segment by different timelevels, eg. Date, day of week, and hour</li>
 
</ul>
 
</ul>
Line 61: Line 59:
 
</ul>
 
</ul>
 
|-
 
|-
−
! scope="row"|  
+
! scope="row" style="background: #ffffff;"|  
 
[[File:T3 Chord.png|center|200px]]
 
[[File:T3 Chord.png|center|200px]]
 
|  
 
|  
 
<ul>
 
<ul>
 
<li>Chart type: Chord diagram</li>
 
<li>Chart type: Chord diagram</li>
−
<li>R Package: chorddiag</li>
+
<li>R Package: [https://github.com/mattflor/chorddiag chorddiag]</li>
 
<li>Interactivity: Set specific datetime using selectIput and sliderInput to view the traffic transfer across floors.<br>
 
<li>Interactivity: Set specific datetime using selectIput and sliderInput to view the traffic transfer across floors.<br>
 
Hover to each floor to see the destination of its outflow traffics.</li>
 
Hover to each floor to see the destination of its outflow traffics.</li>
Line 75: Line 73:
 
</ul>
 
</ul>
 
|-
 
|-
−
! scope="row"|
+
! scope="row" style="background: #ffffff;"|
 
[[File:T3 HexbinMap.jpg|center|300px]]
 
[[File:T3 HexbinMap.jpg|center|300px]]
 
|  
 
|  
 
<ul>
 
<ul>
 
<li>Chart type: Hexagonal binning map</li>
 
<li>Chart type: Hexagonal binning map</li>
−
<li>R Package: hexbin, ggplot, plotly</li>
+
<li>R Package: [https://cran.r-project.org/web/packages/hexbin/index.html hexbin], [https://cran.r-project.org/web/packages/ggplot2/index.html ggplot2], [https://cran.r-project.org/web/packages/plotly/index.html plotly]</li>
 
<li>Key parameter setting: number of bins is set to 50</li>
 
<li>Key parameter setting: number of bins is set to 50</li>
 
<li>Interactivity: Set specific datetime using selectIput and sliderInput to view the traffic density on each floor.<br>
 
<li>Interactivity: Set specific datetime using selectIput and sliderInput to view the traffic density on each floor.<br>
Line 97: Line 95:
 
|-
 
|-
 
! scope="col" style="width: 20%; font-family:Century Gothic;"| Visualization
 
! scope="col" style="width: 20%; font-family:Century Gothic;"| Visualization
−
! scope="col" style="width: 30%; font-family:Century Gothic;"| Methodology & Technique
+
! scope="col" style="width: 40%; font-family:Century Gothic;"| Methodology & Technique
−
! scope="col" style="width: 30%; font-family:Century Gothic;"| Usage
+
! scope="col" style="width: 40%; font-family:Century Gothic;"| Usage
 
|-
 
|-
−
! scope="row"|
+
! scope="row" style="background: #ffffff;"|
 
[[File:T3 sunburst.JPG|center|200px]]
 
[[File:T3 sunburst.JPG|center|200px]]
 
|  
 
|  
 
<ul>
 
<ul>
 
<li>Chart type: Sunburst diagram</li>
 
<li>Chart type: Sunburst diagram</li>
−
<li>R Package: sunburstR</li>
+
<li>R Package: [https://cran.r-project.org/web/packages/sunburstR/index.html sunburstR]</li>
 
<li>Interactivity: Set radio button to view the journey of different member segments.<br>
 
<li>Interactivity: Set radio button to view the journey of different member segments.<br>
 
Set minimum dwell time using sliderInput to exclude passing-by floors.<br>
 
Set minimum dwell time using sliderInput to exclude passing-by floors.<br>
Line 115: Line 113:
 
</ul>
 
</ul>
 
|-
 
|-
−
! scope="row"|
+
! scope="row" style="background: #ffffff;"|
 
[[File:T3 treemap.JPG|center|200px]]
 
[[File:T3 treemap.JPG|center|200px]]
 
|  
 
|  
 
<ul>
 
<ul>
 
<li>Chart type: Treemap</li>
 
<li>Chart type: Treemap</li>
−
<li>R Package: treemap, highCharter </li>
+
<li>R Package: [https://github.com/mtennekes/treemap treemap], [https://github.com/jbkunst/highcharter highCharter] </li>
 
<li>Interactivity: Set radio button to view the journey of different member segments.<br>
 
<li>Interactivity: Set radio button to view the journey of different member segments.<br>
 
Click on floor level to drill down to store level.<br></li>
 
Click on floor level to drill down to store level.<br></li>
Line 129: Line 127:
 
</ul>
 
</ul>
 
|-
 
|-
−
! scope="row"| insert image of boxploter
+
! scope="row" style="background: #ffffff;"|  
 +
[[File:T3 Boxplot.JPG|center|300px]]
 
|  
 
|  
 
<ul>
 
<ul>
 
<li>Chart type: Boxplot</li>
 
<li>Chart type: Boxplot</li>
−
<li>R Package: plotly</li>
+
<li>R Package: [https://cran.r-project.org/web/packages/plotly/index.html plotly]</li>
 
<li>Key parameter setting: number of bins is set to 50</li>
 
<li>Key parameter setting: number of bins is set to 50</li>
 
<li>Interactivity: Click on the treemap to get the relevant boxplot for selected floor.</li>
 
<li>Interactivity: Click on the treemap to get the relevant boxplot for selected floor.</li>
Line 142: Line 141:
 
</ul>
 
</ul>
 
|-
 
|-
−
! scope="row"| insert image of bar chart
+
! scope="row" style="background: #ffffff;"|  
 +
[[File:T3 demobar.JPG|center|300px]]
 
|  
 
|  
 
<ul>
 
<ul>
 
<li>Chart type: Bar chart</li>
 
<li>Chart type: Bar chart</li>
−
<li>R Package: plotly</li>
+
<li>R Package: [https://cran.r-project.org/web/packages/plotly/index.html plotly]</li>
 
<li>Interactivity: Select on the boxplot distribution to view the demographic of interested members.<br>
 
<li>Interactivity: Select on the boxplot distribution to view the demographic of interested members.<br>
 
Set the ‘profile count by’ parameter to decide the y-axis of bar plots.</li>
 
Set the ‘profile count by’ parameter to decide the y-axis of bar plots.</li>
Line 160: Line 160:
 
|-
 
|-
 
! scope="col" style="width: 20%; font-family:Century Gothic;"| Visualization
 
! scope="col" style="width: 20%; font-family:Century Gothic;"| Visualization
−
! scope="col" style="width: 30%; font-family:Century Gothic;"| Methodology & Technique
+
! scope="col" style="width: 40%; font-family:Century Gothic;"| Methodology & Technique
−
! scope="col" style="width: 30%; font-family:Century Gothic;"| Usage
+
! scope="col" style="width: 40%; font-family:Century Gothic;"| Usage
 
|-
 
|-
−
! scope="row"| insert image of bar
+
! scope="row" style="background: #ffffff;"|
 +
[[File:T3 Transbar.JPG|center|300px]]
 
|  
 
|  
 
<ul>
 
<ul>
 
<li>Chart type: Bar chart</li>
 
<li>Chart type: Bar chart</li>
−
<li>R Package: ggplot, plotly</li>
+
<li>R Package: [https://cran.r-project.org/web/packages/ggplot2/index.html ggplot2], [https://cran.r-project.org/web/packages/plotly/index.html plotly]</li>
 
<li>Interactivity: Set date range using radio button to see the plot of different months.</li>
 
<li>Interactivity: Set date range using radio button to see the plot of different months.</li>
 
</ul>
 
</ul>
Line 175: Line 176:
 
</ul>
 
</ul>
 
|-
 
|-
−
! scope="row"| insert image of quadrant
+
! scope="row" style="background: #ffffff;"|
 +
[[File:T3 Quadrant.JPG|center|300px]]
 
|  
 
|  
 
<ul>
 
<ul>
 
<li>Chart type: Scatter plot</li>
 
<li>Chart type: Scatter plot</li>
−
<li>R Package: arules, ggplot, plotly</li>
+
<li>R Package: [https://cran.r-project.org/web/packages/arules/index.html arules], [https://cran.r-project.org/web/packages/ggplot2/index.html ggplot2], [https://cran.r-project.org/web/packages/plotly/index.html plotly]</li>
 
<li>Interactivity: Set date range using radio button to generate association rules based on different month’s transactions.<br>
 
<li>Interactivity: Set date range using radio button to generate association rules based on different month’s transactions.<br>
 
Set parameters (support/confidence/min items) to generate valid associations rules and render plot. <br>
 
Set parameters (support/confidence/min items) to generate valid associations rules and render plot. <br>
Line 190: Line 192:
 
</ul>
 
</ul>
 
|-
 
|-
−
! scope="row"|  
+
! scope="row" style="background: #ffffff;"|  
 
[[File:T3 network.JPG|center|300px]]
 
[[File:T3 network.JPG|center|300px]]
 
|  
 
|  
 
<ul>
 
<ul>
 
<li>Chart type: Network</li>
 
<li>Chart type: Network</li>
−
<li>R Package: visNetwork</li>
+
<li>R Package: [https://github.com/datastorm-open/visNetwork visNetwork]</li>
−
<li>Interactivity: Set date range using radio button to plot rules of different months.</li>
+
<li>Interactivity: Set date range using radio button to plot rules of different months.<br>
 +
Set parameters (support/confidence/min items) to generate valid associations rules and render plot.</li>
 
</ul>
 
</ul>
 
|  
 
|  
Line 203: Line 206:
 
</ul>
 
</ul>
 
|}
 
|}
 +
 +
R Packages for Analytics & Visualization: [https://cran.r-project.org/web/packages/ggplot2/index.html ggplot2], [https://cran.r-project.org/web/packages/plotly/index.html plotly], [https://cran.r-project.org/web/packages/sunburstR/index.html sunburstR], [https://cran.r-project.org/web/packages/hexbin/index.html hexbin], [https://github.com/mtennekes/treemap treemap], [https://github.com/jbkunst/highcharter highCharter], [https://cran.r-project.org/web/packages/arules/index.html arules], [https://github.com/datastorm-open/visNetwork visNetwork]
 +
 +
== References ==
 +
* RStudio: Integrated Development for R. RStudio, Inc., Boston, MA URL: http://www.rstudio.com/.
 +
* Shiny by RStudio. A web application framework for R: https://shiny.rstudio.com/
 +
* FootfallCam in Shopping Mall: http://www.footfallcam.com/Industries/ShoppingMalls
 +
* Knowledge Shopping Mall (智慧商场方案): https://wenku.baidu.com/view/5e9ee994f78a6529657d5301.html
 +
* Custom Hexbin Functions with ggplot: http://unconj.ca/blog/custom-hexbin-functions-with-ggplot.html
 +
* Market Basket Analysis with R: http://www.salemmarafi.com/code/market-basket-analysis-with-r/
 +
* Network visualization with R: http://kateto.net/network-visualization

Latest revision as of 16:04, 6 August 2017

Turning Concrete Malls into Smart Malls (S-MALL):
A web-based analytics application for visualizing and mapping in-mall customer journeys and shopping behaviours

Team S-MALL: Chen Yun-Chen | Chiam Zhan Peng | Zheng Bijun

Overview

Application

User Guide

Poster

 

APPLICATION OVERVIEW

Movement Analysis Member Analysis Association Analysis
T3 Appoverview.png



APPLICATION DESCRIPTION

Part1: Movement Analysis

Visualization Methodology & Technique Usage
T3 Trellis.JPG
  • Chart type: Line chart & trellis plot
  • R Package: ggplot2, plotly
  • Interactivity: Use selectInput to control plot and segment by different timelevels, eg. Date, day of week, and hour
  • Line chart without trellis (segment=None) can be used to analyze the daily/weekly/hourly pattern of footfalls.
  • Trellis plot can be used to detect the cycling pattern over time.
T3 Chord.png
  • Chart type: Chord diagram
  • R Package: chorddiag
  • Interactivity: Set specific datetime using selectIput and sliderInput to view the traffic transfer across floors.
    Hover to each floor to see the destination of its outflow traffics.
  • Analyze traffic flow across floor for specific datetime selection
T3 HexbinMap.jpg
  • Chart type: Hexagonal binning map
  • R Package: hexbin, ggplot2, plotly
  • Key parameter setting: number of bins is set to 50
  • Interactivity: Set specific datetime using selectIput and sliderInput to view the traffic density on each floor.
    Click on specific hexbin to investigate members identity.
  • Analyze traffic density of floors for specific datetime selection
  • Drill down to shoppers’ identity based on interested density area

Part2: Member Analysis

Visualization Methodology & Technique Usage
T3 sunburst.JPG
  • Chart type: Sunburst diagram
  • R Package: sunburstR
  • Interactivity: Set radio button to view the journey of different member segments.
    Set minimum dwell time using sliderInput to exclude passing-by floors.
    Hover to see the path and relevant statistics.
  • Investigate popular shopping path of members based on floors.
T3 treemap.JPG
  • Chart type: Treemap
  • R Package: treemap, highCharter
  • Interactivity: Set radio button to view the journey of different member segments.
    Click on floor level to drill down to store level.
  • Analyze members’ average dwell time on each floor and store.
T3 Boxplot.JPG
  • Chart type: Boxplot
  • R Package: plotly
  • Key parameter setting: number of bins is set to 50
  • Interactivity: Click on the treemap to get the relevant boxplot for selected floor.
  • Analyze dwell time distribution of each store based on floor selection on treemap.
T3 demobar.JPG
  • Chart type: Bar chart
  • R Package: plotly
  • Interactivity: Select on the boxplot distribution to view the demographic of interested members.
    Set the ‘profile count by’ parameter to decide the y-axis of bar plots.
  • Analyze members’ profile based on selection of their dwell time distribution. For example, we may analyze the high time spender of a specific store to see if they are of similar demographic.

Part3: Association Anlaysis

Visualization Methodology & Technique Usage
T3 Transbar.JPG
  • Chart type: Bar chart
  • R Package: ggplot2, plotly
  • Interactivity: Set date range using radio button to see the plot of different months.
  • Investigate popular shopping path of members based on floors.
T3 Quadrant.JPG
  • Chart type: Scatter plot
  • R Package: arules, ggplot2, plotly
  • Interactivity: Set date range using radio button to generate association rules based on different month’s transactions.
    Set parameters (support/confidence/min items) to generate valid associations rules and render plot.
    Hover over the bar to fade out non-relevant rules in the quadrant.
    Hover over the network to fade out non-relevant rules in the quadrant.
  • Analyze the competitive position of different rules based on set parameters.
T3 network.JPG
  • Chart type: Network
  • R Package: visNetwork
  • Interactivity: Set date range using radio button to plot rules of different months.
    Set parameters (support/confidence/min items) to generate valid associations rules and render plot.
  • Visualize the associations among departments.

R Packages for Analytics & Visualization: ggplot2, plotly, sunburstR, hexbin, treemap, highCharter, arules, visNetwork

References

Retrieved from ‘https://wiki.smu.edu.sg/1617t3isss608g1/index.php?title=S-MALL_Application&oldid=8766’