-
Notifications
You must be signed in to change notification settings - Fork 10
/
Copy pathch13.Rmd
131 lines (99 loc) · 3.09 KB
/
ch13.Rmd
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
---
title: "地理資訊的繪圖（Leaflet）"
author: "郭耀仁"
date: "`r Sys.Date()`"
output: slidy_presentation
---
```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = TRUE, warning = FALSE)
```
## 安裝與載入
```
install.packages("leaflet")
```
```{r}
library(leaflet)
```
## leaflet.js
- leaflet.js 是 JavaScript 的一個框架
- 可以繪製互動式地圖
- R 語言使用者能夠使用 `leaflet` 套件來跳過撰寫 JavaScript 使用 leaflet.js
## 快速實作
```{r}
#hello_map <- leaflet()
#hello_map <- addTiles(hello_map)
#hello_map <- addMarkers(hello_map, lng = 121.539366, lat = 25.017326, popup = "臺灣大學")
#hello_map
hello_map <- leaflet() %>%
addTiles() %>%
addMarkers(lng = 121.539366, lat = 25.017326, popup = "臺灣大學")
hello_map
```
## 基本地圖
- `setView()` 用來設定地圖中心與縮放比例
```{r}
base_map <- leaflet() %>%
setView(lng = 121.539366, lat = 25.017326, zoom = 14) %>%
addTiles()
base_map
```
## `addProviderTiles()`
- `addTiles()` 使用預設的 [OpenStreetMap](https://www.openstreetmap.org/#map=5/51.500/-0.100)
- `addProviderTiles()` 可以使用其他的 [leaflet-provider](http://leaflet-extras.github.io/leaflet-providers/preview/index.html) plugin，其中有些地圖可能要在該專案註冊才能呼叫。
```{r}
#Stamen
provider_map <- leaflet() %>%
setView(lng = 121.539366, lat = 25.017326, zoom = 10) %>%
addProviderTiles("Stamen.TonerLite")
provider_map
```
## `addProviderTiles()`（2）
- Thunderforest
```{r}
#Thunderforest
provider_map <- leaflet() %>%
setView(lng = 121.539366, lat = 25.017326, zoom = 10) %>%
addProviderTiles("Thunderforest.OpenCycleMap")
provider_map
```
## `addProviderTiles()`（3）
```{r}
combined_map <- leaflet() %>%
setView(lng = 121.539366, lat = 25.017326, zoom = 10) %>%
addProviderTiles("Stamen.TonerLite") %>%
addProviderTiles("Thunderforest.OpenCycleMap",
options = providerTileOptions(opacity = 0.3))
combined_map
```
## `addMarkers()`
- 新增地點的標記與點擊後出現的訊息
```{r}
marker_NTU <- leaflet() %>%
addTiles() %>%
addMarkers(lng = 121.539366, lat = 25.017326, popup = "National Taiwan University")
marker_NTU
```
## `addMarkers()`（2）
```{r}
stores <- read.csv("https://storage.googleapis.com/r_rookies/stores711inTP.csv", encoding = "UTF-8")
markers_711 <- leaflet(data = stores) %>%
addTiles() %>%
addMarkers(~lng, ~lat, popup = ~as.character(popups1))
markers_711
```
## `addMarkers()`（3）
- 加入 `icon` 與 `iconSize` 參數客製化標記的圖示
```{r}
markers_711 <- leaflet(data = stores) %>%
addTiles() %>%
addMarkers(~lng, ~lat, popup = ~as.character(popups1), icon = list(iconUrl = "https://storage.googleapis.com/r_rookies/711_logo.gif", iconSize = c(20, 20)))
markers_711
```
## `addMarkers()`（4）
- 加入 `clusterOptions` 參數
```{r}
markers_711 <- leaflet(data = stores) %>%
addTiles() %>%
addMarkers(~lng, ~lat, popup = ~as.character(popups1), icon = list(iconUrl = "https://storage.googleapis.com/r_rookies/711_logo.gif", iconSize = c(20, 20)), clusterOptions = markerClusterOptions())
markers_711
```