Skip to content

Instantly share code, notes, and snippets.

View LuisSevillano's full-sized avatar

Luis Sevillano LuisSevillano

101 followers · 233 following
View GitHub Profile
@mbostock
mbostock / .block
Last active July 20, 2019 01:01
Clipped Map Tiles
license: gpl-3.0
redirect: https://observablehq.com/@d3/clipped-map-tiles
@cosmocatalano
cosmocatalano / instagram_scrape.php
Last active August 6, 2023 07:32
Quick-and-dirty Instagram web scrape, just in case you don't think you should have to make your users log in to deliver them public photos.
<?php
//returns a big old hunk of JSON from a non-private IG account page.
function scrape_insta($username) {
$insta_source = file_get_contents('http://instagram.com/'.$username);
$shards = explode('window._sharedData = ', $insta_source);
$insta_json = explode(';</script>', $shards[1]);
$insta_array = json_decode($insta_json[0], TRUE);
return $insta_array;
}
@dwtkns
dwtkns / README.md
Last active October 19, 2023 16:44
Slippy map + extent indicator
@jareware
jareware / SCSS.md
Last active April 23, 2024 22:13
Advanced SCSS, or, 16 cool things you may not have known your stylesheets could do

⇐ back to the gist-blog at jrw.fi

Advanced SCSS

Or, 16 cool things you may not have known your stylesheets could do. I'd rather have kept it to a nice round number like 10, but they just kept coming. Sorry.

I've been using SCSS/SASS for most of my styling work since 2009, and I'm a huge fan of Compass (by the great @chriseppstein). It really helped many of us through the darkest cross-browser crap. Even though browsers are increasingly playing nice with CSS, another problem has become very topical: managing the complexity in stylesheets as our in-browser apps get larger and larger. SCSS is an indispensable tool for dealing with this.

This isn't an introduction to the language by a long shot; many things probably won't make sense unless you have some SCSS under your belt already. That said, if you're not yet comfy with the basics, check out the aweso

@MattWoelk
MattWoelk / README.md
Last active September 17, 2017 12:20
Binned Line Chart

This is a Binned Line Chart version of Mike Bostock's zoomable area chart. You can find his source here. The graph shows number of flights per day in the United States.

  • Use the mouse-wheel to zoom in and out, and drag the slider to adjust the size of the bins.
  • View with the step-after interpolation method to see the discrete bins.

This is a small demo made part-way through Matt Woelk's Masters Thesis. A video demonstration of the full version is available.

@mjhoy
mjhoy / Makefile
Last active December 19, 2022 04:44
Costa Rica shaded relief
all: hill-relief.jpg costarica_min_topo.json
# -------------
# Relief raster
# -------------
#
# Notice the `zip` file requirements here have no download.
# You will need to search for them online. They are from the
# SRTM project: http://www2.jpl.nasa.gov/srtm/
# (which appears to have multiple versions of files).
@explunit
explunit / README.md
Created May 18, 2013 04:31
D3.js tree with "drag near" logic

Use a larger transparent shape as an alternative to intersection or collision detection when dragging a node. Sparked by this StackOverflow question

@rclark
rclark / L.TopoJSON.js
Last active December 7, 2022 00:23
TopoJSON-aware Leaflet layer
/*
You'll need something like this in your HTML:
<script src="http://d3js.org/topojson.v1.min.js"></script>
*/
L.TopoJSON = L.GeoJSON.extend({
addData: function(jsonData) {
if (jsonData.type === "Topology") {
for (key in jsonData.objects) {
geojson = topojson.feature(jsonData, jsonData.objects[key]);
@jczaplew
jczaplew / typeahead.html
Last active April 23, 2020 18:21
A very simple example showing how to force the Bootstrap typeahead (http://twitter.github.io/bootstrap/javascript.html#typeahead) to match only the start of words. The default matcher function matches the user query to any part of the possible results, which is often times undesirable - for example, in the standard typeahead in the example below…
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.no-icons.min.css" rel="stylesheet"/>
</head>
<body>
<div style="padding:20px;">
<p>Standard Bootstrap typeahead</p><input placeholder='Type a country' type='text' size='22' name='countries' data-provide='typeahead'/>
@explunit
explunit / README.md
Created July 25, 2013 18:20
Chained transitions between points on a path/line