tileserver on Github pages - leaflet

Does anyone know how I can have a tile server hosted on Github pages please. I am making my own pyramid of image tiles (using either pyvips or gdal) but instead of having the tile server locally on my machine, I would like to populate a Github with these tiles and then set my application to fetch the appropriate tiles from that repo.
Any pointers highly appreciated.

Yes !
You can check https://wiki.openstreetmap.org/wiki/Slippy_map_tilenames that will explain to you the url convention used for serving tiles.
You can then create folders of images on github with the same structure : zoom level / x_coordinates / y_coordinates.png.
I've created and test github folder.
Here is the demo page
You can see a tile being displayed, and it is served from github.

Related

Images not showing up on GitHub

Im trying to publish a challenge on frontend mentor using Git Hub.
When i try to use the live url, images dont show up.
Ive tried PNG, paths and some more things i saw on the Internet but ,for now, nothing has worked.
Live Url:https://pires29.github.io/First-Project/
GitHub Page:https://github.com/Pires29/First-Project.git
(Could put the code in here)
img src="image-qr-code.PNG"
Check your path.
Your images should be on the public file and your path must looks like /<imagesFile>/image.png

Add google drive images to README.md on GitHub

Recently I joined GitHub. I am hosted some projects there.
I need to include some my GoogleDrive images in my README File. I don't know how to do that.
First, get a share-able link to your Google Drive image so anyone can view it.
Then, the GitHub-flavored markdown for an image is what you're looking for:
![optional-description-here](link-here)
This is the syntax for an image to be loaded from a link. My favorite example:
![StackOverflow logo](https://www.stackoverflowbusiness.com/hubfs/B2B-SO/images/logo-so-PRINT-4.png)
I even added a public example for you here on my GitHub

Github - Have gifs play at the same time

I included 40+ gifs in my github readme but the issue I am facing is that they do not start and stop at the time. I created the gifs myself so I can verify that they are of the same length and have the same delay between each image.
Does anyone have any suggestion how I can make these gifs play together ? Below is an example of the code that I use.
![Alt Text](https://github.com/fakeuser/temp/blob/master/results/0-3-shape.gif)
You would need to preload them, through a javascript function, but not GitHub repo markdown would allow you that level of control.
It would then be easier to display static gifs, with a link to an external page where you can run javascripts and better control the pre-loading of the animated gifs.

Can I use markdown to link to images on github pages?

I managed github to run my index.md through Jeckyl and display it under github.io by following https://help.github.com/articles/creating-project-pages-manually/. However, my images links of this form:
![Sicherung vorbereiten](img/export.png?raw=true)
don't show as they did in README.md
Can I use images together with github.io when run from markdown files?
Add a / in front of your img folder, like this:
![Sicherung vorbereiten](/img/export.png)
I just tried it on a test github pages page and it worked for me.
Source: official Jekyll documentation example: https://jekyllrb.com/docs/posts/#including-images-and-resources.
Including images and resources
At some point, you’ll want to include images, downloads, or other digital assets along with your text content. One common solution is to create a folder in the root of the project directory called something like assets, into which any images, files or other resources are placed. Then, from within any post, they can be linked to using the site’s root as the path for the asset to include. The best way to do this depends on the way your site’s (sub)domain and path are configured, but here are some simple examples in Markdown:
Including an image asset in a post:
... which is shown in the screenshot below:
![My helpful screenshot](/assets/screenshot.jpg)
Linking to a PDF for readers to download:
... you can [get the PDF](/assets/mydoc.pdf) directly.
Related
For additional image manipulation instructions, such as align left, align center, align right, image resizing, text wrapping, etc., see my other answer here: GitHub README.md center image
if you are accessing the picture by using the Github link, don't forget to add ?raw=true at the end of URL.
e.g. https://github.com/repo_name/img/picture_name.png?raw=true
Otherwise, the picture won't show on your webpage.

How to display .mbtiles on a hosted server

I am using the containerized deployment of openmaptiles. I downloaded all the basic included base maps, (dark-matter, positron, etc..). Then I downloaded the satellite tiles separately from https://openmaptiles.com/downloads/planet/ . Now I have a satellite.mbtiles that I have placed in the same location as my config.json and osm-2017-07-03-v3.6.1-planet.mbtiles. But when I hit the hosted page that shows the available tiles I have, the satellite files are not there. What do I need to do to pull these satellite files I have?
To link to the current dark-matter tiles I am using something like: http://localhost/styles/dark-matter/{z}/{x}/{y}.png , what would I need for the satellite?
Also we do have a business package purchased from these guys so nothing should hamper any of this.
TLDR: How do I utilize two .mbtiles at once, using the hosted deployment.