carderne / leaflet-gsheets Goto Github PK

Your instructions state "To get started, fork this repo and use the .CSV files in the data-sources folder as examples to create the Google Sheets ..." but there are no CSV files in your repository upon which to model my Google Sheet. Thanks!

Hi Carderne,

Thanks a lot for the whole process ! I am trying to make it work with a mapbox style. I tried to do it by deleting this part :

var map = L.map('map').setView([40, -100], 4);

// This is the Carto Positron basemap
var basemap = L.tileLayer('https://cartodb-basemaps-{s}.global.ssl.fastly.net/light_all/{z}/{x}/{y}{r}.png', {
  attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> &copy; <a href="http://cartodb.com/attributions">CartoDB</a>',
  subdomains: 'abcd',
  maxZoom: 19
});
basemap.addTo(map);

And by adding this one instead :

mapboxgl.accessToken = 'My_access_token'; var map = new mapboxgl.Map({ container: 'map', style: 'My_style_URL', center: [-1.547264, 47.204631], zoom: 10 }); basemap.addTo(map);

I am quite new at coding, and every element I found about G. Sheets + Mapbox is old and tools presented do not exist anymore. So, I am counting a lot on your solution, do you think it could work with Mapbox ?

Bests,

Koosch

Hi Chris,

I really appreciate this tool!

I'm looking for a mechanism where I can load circles instead of Polygons, this way we could define more general 'regions' instead of administrative boundaries (this is a hand coded example, built a few years ago - https://specproj.web.viu.ca/Coal/CoalMines/NanaimoCoalMines.html) - doing projects like this via a spreadsheet would greatly simply things.

I've tried swapping out the polygons items like[polyURL, polygonLayer . . . ] and modifying them for circles,

  for (var row in data) {
    // The Sheets data has a column 'include' that specifies if that row should be mapped
    if (data[row].include == "y") {
      var coords = JSON.parse(data[row].geometry);

      geojsonStates.features.push({
        type: "Feature",
        geometry: {
          type: "Circle",   // I don't think Circle is supported
          coordinates: coords
        },
        properties: {
          name: data[row].name,
          summary: data[row].summary,
          state: data[row].state,
          local: data[row].local
        }
      });
    }
  }

I tried the same with the points . . . thinking of a circle as a point with a radius. But, I think I have the wrong approach here.

Maybe you have explored this in the past? I was wondering if you had any pointers as to how to modify this?

Thanks for considering,

Dan

Thanks to @zenfinity for pointing this out.

There are currently CORS issues with Google Sheets and PapaParse: jsoma/tabletop#189

There are a few workarounds proposed in the thread above but I'm going to hold off for now, as the Sheets API change will likely break some of them...

It works because the variable is misspelled three times, but it did cause a little confusion for me.
Line 111, 118
and Line 138

How to develop locally? Browser complains about CORS amongst others

(map loads but the Google sheets data is not imported)