j4-m / gridsome-source-gmaps-geocode

Gridsome source plugin to geocode your data using the Google Maps Geocoding API 🗺️
2 stars 1 forks source link

Confused #1

Open Kainkainkain opened 4 years ago

Kainkainkain commented 4 years ago

So I feed real world address to get long/lat or vice versa? Or is it the users current location? Or?

Also, does it put into graphql this: { allOffice { edges { node { geocode { lat lng } } } } }

But where do I give it source material?

Thanks - looking forward to using

j4-m commented 4 years ago

Hello

The plugin will try to geocode a field on your source data.

So if you take my example gridsome.config.js from the README:

module.exports = {
  ...
  plugins: [
    {
      use: '@gridsome/source-filesystem',
      options: {
        path: '_content/**/*.md',
        typeName: 'Office'
      }
    },
    {
      use: 'gridsome-source-gmaps-geocode',
      options: {
        apiKey: 'your-gmaps-geocode-api-key-here',
        sourceTypeName: 'Office',
        sourceTypeField: 'address'
      }
    },
  ]
}

Then in your _content directory you'll need at least one markdown file which provides an address field, e.g.

---
id: 123
address: '1 example street, example city, example country'
---

Then, if you have provided a valid apiKey in the plugin configuration, you will be able to query access the geocode data on your Office nodes:

<static-query>
{
  allOffice {
    edges {
      node {
        geocode {
          lat
          lng
        }
      }
    }
  }
}
</static-query>

i.e. have the above in a component then you will have access to $static.allOffice.edges.node.geocdoe.lat and $static.allOffice.edges.node.geocdoe.lng

This lat and lng are returned from the Google Maps Geocoding API for the location 1 example street, example city, example country.

Hope this helps, let me know if you need more help.

Kainkainkain commented 4 years ago

Ok got it, I provide office and address and the plugin will add geocode into the graphql. Ace. So if I get the values from a headless cms in gridsome.server.js - not a plugin, it wont work for me? or just put it in like `module.exports = { ... plugins: [

{
  use: 'gridsome-source-gmaps-geocode',
  options: {
    apiKey: 'your-gmaps-geocode-api-key-here',
    sourceTypeName: 'Office',
    sourceTypeField: 'address'
  }
},

] }`