starts to migrate examples;
MODIFY
_config.yml
_config.yml
@@ -15,3 +15,10 @@ collections:
output: true
tutorial:
output: true
+
+# # otherwise some big files in this data folder will hang jekyll build
+# exclude:
+# - data
+
+keep_files:
+ - data

MODIFY
_example/heatmap/index.html
_example/heatmap/index.html
---
layout: example
+title: Heatmap
+about: This example shows how to add a heatmap to a <b>map</b>.
---
<link rel="stylesheet" href="main.css"/><script type="text/javascript" src="main.js"></script><div id="controls"><div title="The data set to plot." class="form-group"><label for="dataset">Data Set</label><select id="dataset" param-name="dataset" placeholder="Activity"><option value="adderall" url="AdderallCities2015.csv" title="9555 points">Adderall</option><option value="cities" url="cities.csv" title="30101 points">U.S. Cities</option><option value="earthquakes" url="earthquakes.json" title="1.3 million points">Earthquakes</option></select><span id="points-loaded"></span></div><div title="Number of points. Leave blank for the entire original data set. If a smaller number, only a subset of points will be shown. If a larger number, some of the data will be duplicated with random offsets." class="form-group"><label for="points">Number of Points</label><input id="points" type="number" min="1" step="100"/><span id="points-shown"></span></div><div title="Delay between movement and heatmap recalculation in milliseconds." class="form-group"><label for="updateDelay">Update Delay (ms)</label><input id="updateDelay" type="number" placeholder="50" min="0"/></div><div title="Binning the data is faster for large sets and slower for small ones. Binning tends to make dense data look somewhat sparser. Smaller bins are closer in appearance to unbinned data but take longer to compute." class="form-group"><label for="binned">Bin Data</label><select id="binned" placeholder="auto"><option value="auto" title="Bin data if there are more points than the number of bins that would be used by default">Auto</option><option value="false" title="Do not bin data.">Never</option><option value="true" title="Always bin data using the default bin size (1/8th of the total radius).">Always</option><option value="3" title="Always bin data using a 3 pixel bin size.">3 pixel bin size</option><option value="5" title="Always bin data using a 5 pixel bin size.">5 pixel bin size</option><option value="10" title="Always bin data using a 10 pixel bin size.">10 pixel bin size</option><option value="15" title="Always bin data using a 15 pixel bin size.">15 pixel bin size</option><option value="20" title="Always bin data using a 20 pixel bin size.">20 pixel bin size</option><option value="25" title="Always bin data using a 25 pixel bin size.">25 pixel bin size</option></select></div><div title="Opacity of heatmap layer (0 to 1)." class="form-group"><label for="opacity">Opacity</label><input id="opacity" type="number" placeholder="0.75" min="0" max="1" step="0.05"/></div><div title="Value to map to minimum intensity. Leave blank to auto calculate." class="form-group"><label for="minIntensity">Min. Intensity</label><input id="minIntensity" type="number"/></div><div title="Value to map to maximum intensity. Leave blank to auto calculate." class="form-group"><label for="maxIntensity">Max. Intensity</label><input id="maxIntensity" type="number"/></div><div title="Radius of center of points in pixels." class="form-group"><label for="radius">Radius</label><input id="radius" type="number" placeholder="25" min="1"/></div><div title="Radius of blur around points in pixels." class="form-group"><label for="blurRadius">Blur Radius</label><input id="blurRadius" type="number" placeholder="15" min="0"/></div><div title="Use either a Gaussian distribution or a solid circle with a blurred edge for each point. If a Guassian is used, the total radius is the sume of the radius and blur radius values." class="form-group"><label for="gaussian">Gaussian Points</label><input id="gaussian" type="checkbox" placeholder="true" checked="checked"/></div><div title="Color Gradient. Entries with intensities of 0 and 1 are needed to form a valid color gradient." class="form-group"><label>Color Gradient</label><table class="gradient"><tr><th title="Intensity. 0 is minimum, 1 is maximum">I</th><th title="Red channel, 0 to 255">R</th><th title="Green channel, 0 to 255">G</th><th title="Blue channel, 0 to 255">B</th><th title="Alpha channel, 0 to 1">A</th></tr><tr><td><input id="gradI1" type="number" min="0" max="1" step="0.01"/></td><td><input id="gradR1" type="number" min="0" max="255" step="1"/></td><td><input id="gradG1" type="number" min="0" max="255" step="1"/></td><td><input id="gradB1" type="number" min="0" max="255" step="1"/></td><td><input id="gradA1" type="number" min="0" max="1" step="0.01"/></td></tr><tr><td><input id="gradI2" type="number" min="0" max="1" step="0.01"/></td><td><input id="gradR2" type="number" min="0" max="255" step="1"/></td><td><input id="gradG2" type="number" min="0" max="255" step="1"/></td><td><input id="gradB2" type="number" min="0" max="255" step="1"/></td><td><input id="gradA2" type="number" min="0" max="1" step="0.01"/></td></tr><tr><td><input id="gradI3" type="number" min="0" max="1" step="0.01"/></td><td><input id="gradR3" type="number" min="0" max="255" step="1"/></td><td><input id="gradG3" type="number" min="0" max="255" step="1"/></td><td><input id="gradB3" type="number" min="0" max="255" step="1"/></td><td><input id="gradA3" type="number" min="0" max="1" step="0.01"/></td></tr><tr><td><input id="gradI4" type="number" min="0" max="1" step="0.01"/></td><td><input id="gradR4" type="number" min="0" max="255" step="1"/></td><td><input id="gradG4" type="number" min="0" max="255" step="1"/></td><td><input id="gradB4" type="number" min="0" max="255" step="1"/></td><td><input id="gradA4" type="number" min="0" max="1" step="0.01"/></td></tr><tr><td><input id="gradI5" type="number" min="0" max="1" step="0.01"/></td><td><input id="gradR5" type="number" min="0" max="255" step="1"/></td><td><input id="gradG5" type="number" min="0" max="255" step="1"/></td><td><input id="gradB5" type="number" min="0" max="255" step="1"/></td><td><input id="gradA5" type="number" min="0" max="1" step="0.01"/></td></tr><tr><td><input id="gradI6" type="number" min="0" max="1" step="0.01"/></td><td><input id="gradR6" type="number" min="0" max="255" step="1"/></td><td><input id="gradG6" type="number" min="0" max="255" step="1"/></td><td><input id="gradB6" type="number" min="0" max="255" step="1"/></td><td><input id="gradA6" type="number" min="0" max="1" step="0.01"/></td></tr></table></div></div>
\ No newline at end of file

MODIFY
_layouts/default.html
_layouts/default.html
<body id="page-top" class="index">
<!-- Navigation -->
- <nav id="mainNav" class="navbar navbar-default navbar-custom navbar-fixed-top">
+ <nav id="mainNav" class="navbar navbar-default navbar-custom navbar-fixed-top{%if layout.navbar_affix %} affix{%endif%}">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<li class="{%if page.url == "/"%}active{%endif%}">
<a href="/">Welcome</a>
</li>
- <li class="{%if page.url contains "tutorials"%}active{%endif%}">
+ <li class="{%if page.url contains "tutorial"%}active{%endif%}">
<a href="/tutorials">Tutorials</a>
</li>
- <li class="{%if page.url contains "examples"%}active{%endif%}">
+ <li class="{%if page.url contains "example"%}active{%endif%}">
<a href="/examples">Examples</a>
</li>
<li>

MODIFY
_layouts/example.html
_layouts/example.html
---
layout: default
+navbar_affix: true
---
+<div class="page example">
<link href="{{ "css/example.css" | relative_url }}" rel="stylesheet">
-<!-- include the main bundle-->
<script type="text/javascript" src="../bundle.js" charset="UTF-8"></script>
-<div class="page example">
- {{ content }}
<div id="map"></div>
+ {{ content }}
+ <div class="container">
+ <div class="row">
+ <div class="col-md-12">
+ {{page.about}}
+ </div>
+ </div>
+ </div>
</div>
\ No newline at end of file

ADD
css/example.scss
+---
+---
+
+@media (min-height: 768px){
+ html, body {
+ height: 100%;
+ width: 100%;
+ }
+
+ .content-wrapper{
+ height: calc(100% - 90px);
+ padding-top: 70px;
+ }
+
+ .page.example{
+ height: 100%;
+
+ #map {
+ width: 100%;
+ height: 70%;
+ overflow: hidden;
+ }
+ }
+}
+
+@media (max-height: 768px){
+ .content-wrapper{
+ height: calc(100% - 90px);
+ padding-top: 50px;
+ }
+
+ .page.example{
+ height: 70vh;
+ }
+}
\ No newline at end of file

MODIFY
css/main.scss
css/main.scss
@@ -39,7 +39,7 @@ p{
}
.content-wrapper {
- margin-top: 100px;
+ padding-top: 100px;
position: relative;
}

MODIFY
js/agency.js
js/agency.js
});
// Offset for Main Navigation
+ if(!$('#mainNav').hasClass('affix')){
$('#mainNav').affix({
offset: {
top: 100
}
- })
+ });
+ }
})(jQuery); // End of use strict

starts to migrate examples;