RecoveryAPP.github.io/ASPprotocols.html at master · RecoveryAPP/RecoveryAPP.github.io · GitHub

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
<!DOCTYPE html>
<html lang="en">

<head>

  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <meta name="description" content="">
  <meta name="author" content="">

  <title>Alonso S. Perales Correspondence</title>

  <!-- Bootstrap core CSS -->
  <link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">

  <!-- Custom styles for this template -->
  <link href="css/full-width-pics.css" rel="stylesheet">

</head>

<body>

  <!-- Navigation -->
  <nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
    <div class="container">
      <a class="navbar-brand" href="ASPCorrespondence.html">Recovering the US Hispanic Literary Heritage</a>
      <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
      </button>
      <div class="collapse navbar-collapse" id="navbarResponsive">
        <ul class="navbar-nav ml-auto">
          <li class="nav-item active">
            <a class="nav-link" href="ASPCorrespondence.html">Home
              <span class="sr-only"></span>
            </a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="ASPabout.html">About</a>
          </li>
         <li class="nav-item">
            <a class="nav-link" href="ASPresources.html">Resources</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="ASPprotocols.html">Protocols</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="ASPcontact.html">Contact</a>


          </li>
        </ul>
      </div>
    </div>
  </nav>

  <!-- Header - set the background image for the header in the line below -->
  <header class="py-5 bg-image-full" style="background-image: url('https://recoveryapp.github.io/envelopes2.jpg');">

  </header>

 <!--Section: Contact v.2-->
<section class="mb-4">

    <!-- Content section -->
  <section class="py-5">
    <div class="container">
      <h1>Protocols</h1>
         <p>The Alonso S. Perales Correspondence digital project uses <a href="https://kepler.gl/">Kepler Maps</a> to visualize the extent of Perales’ network. To do so, we selected a sampling of 77 envelopes, scanned them, and created metadata for them. The scanned images make up part of the Alonso S. Perales Collection on Recovering the US Hispanic Literary Heritage Digital Archives, (<a href="usldhrecovery.uh.edu/">usldhrecovery.uh.edu</a>), an Omeka site. </p>

         <p>We created a CSV with metadata from each envelope that included the following columns:  identifier, link (to the image on Omeka), title, sender name (if available), recipient name (Alonso S. Perales), year, description, sentLocation, receivedLocation, senderLat,  senderLat, senderLng, receiverLat, receiverLng. In cases of unknown senders, we used brackets: [Unknown]. </p>
         <p>Once the CSV was ready, we dropped the CSV into Kepler to add the data to the map. If you want to experiment, you can load sample data directly from the Kepler site. Under layers, we made visible the sender and receiver as points, then added an arc to display the sender to receiver connection. After adjusting the colors in the map, we saved and exported the map as html. (Another option is to select Dropbox as storage. Kepler will generate a permalink to the map from Dropbox, which you can then embedded into the html website using a responsive iframe.)   </p>
      <p><ol>
      <li>Create metadata CSV. </li>
      <li>Visit  <a href="https://kepler.gl/">Kepler Maps</a>. Drag and drop CSV to add data to map.</li>
      <li>[Basic] Sender should be set as Point (to verify that the point will be visible, make sure the "eye" in the new layer box is not crossed out. Click on it to toggle between visible/invisible).</li>
      <li>Columns: Lat: senderLat and Lon: senderLng</li>
      <li>ii.	Leave Altitude blank</li>
      <li>Add Labels if desired and change font size/color.</li>
      <li>[Basic] To create arcs, select Arc (you can also select Line, Gride, Polygon, etc. based on your data). Click on the eye to toggle between visible/invisible.</li>
      <li>Columns (sources): Source Lat: float senderLat</li>
      <li>Columns (sources): Source Lng: float senderLng</li>
      <li>Columns (sources): Target Lat: float receiverLat</li>
      <li>Columns (sources): Target Lng: float receiverLng</li>
      <li>Select Colors for Source and Target</li>
      <li>Select Strong weight, if needed.</li>
      <li>Add additional filters, if needed.</li>
      <li>Click export icon, click Export Map.</li>
      <li>Choose map format (html or json)–this map was created using html.</li>
      <li>Optional: Add Mapbox access token. Leave blank if you do not have one.</li>
      <li>Choose Map Mode: Allow users to read the map.</li>
      <li>IF you prefer to use DropBox storage instead of html export: Click Share Public URL, choose Dropbox as storage. You will have to authenticate this using your Dropbox credentials. Click Upload. Kepler will then create a permalink to the map. You can then link directly to the map.</li>
      </ol>


    </div>
</section>
<!--Section: Contact v.2-->

  <!-- Content section -->
  <section class="py-5">
    <div class="container">
      <h2>Further Documentation</h2>

      <p><a href="https://docs.kepler.gl/docs/api-reference">Kepler Documentation</a></p>
      <p><a href="https://omeka.readthedocs.io/en/latest/">Omeka Developer Documentation</a></p>
      <p><a href="https://docs.google.com/spreadsheets/d/1p6OPI_U7CzB3bTBRptpOaPX18KHxoXhGXIdiI7d9cJQ/edit?usp=sharing">Perales Correspondence Dataset (CSV)*</a></p>
      <p>*Use of this data must be cited: US Latino Digital Humanities program. <i>Perales Correspondence Dataset.</i> Recovering the US Hispanic Literary Heritage/Arte Público Press. 2019.</p>

      </p>
    </div>
  </section>

  <!-- Footer -->
  <footer class="py-5 bg-dark">
    <div class="container">
      <p class="m-0 text-center text-white">Copyright &copy; Arte Público Press 2019<br><a href="https://artepublicopress.com/">artepublicopress.com</a></p>
    </div>
    <!-- /.container -->
  </footer>

  <!-- Bootstrap core JavaScript -->
  <script src="vendor/jquery/jquery.min.js"></script>
  <script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>

</body>
</html>