carderne / leaflet-gsheets

Simple web map that live updates from Google Sheets
https://rdrn.me/leaflet-gsheets
MIT License
21 stars 91 forks source link

Circle Markers #4

Closed telezoic closed 4 years ago

telezoic commented 4 years ago

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

carderne commented 4 years ago

Hi Dan, have a look at the changes I just pushed. You can set the marker type for the points on line 146 and the radius just below on line 151. For circleMarker the radius is in pixels (i.e. it will look the same size at any zoom) and for circle, the radius is in metres (constant ground size).

Hope that works for you!

telezoic commented 4 years ago

Awesome! Thanks Chris! Much appreciated! D.