Adding the Google Maps API key to Enketo in Central

Hi all,

As I am new to programming, this question might be easy to answer for others.

I set up my own server with OS ubuntu to run ODK Central. I followed the provided manual.
I´d like to add the Google Maps API to make the Map widget work nicely within the surveys - customizing enketo, like described here: https://docs.getodk.org/central-install-digital-ocean/#customizing-enketo

Now the problem: I cannot find or enter the file directory via
$ cd central
Searching my file directory I could not find any hint of ODK Central.

Do I need stop the docker?
How could I enter the respective directory?

Sadly, I do not have any IT nerd in my bubble.

Looking forward to the power of this forum.

It's probably in your home directory. Try going to that directory first. ~ is a short for your home directory.

cd ~
cd central
1 Like

Hello @Agrari,

In the 0.002% chance that @yanokwa's approach does not help you out, it could be you started your process in an existing terminal that was pointing to a directory other than Home.

You can run
docker inspect <container_name> | grep "com.docker.compose.project.working_dir"
from a new terminal (Ctrl + Alt + T to quickly launch one :wink:) to see where your container is running from.

If in doubt about the <container_name> to use, you can first run docker ps and look in the NAME column. For most people, simply running
docker inspect central-nginx-1 | grep "com.docker.compose.project.working_dir"
or
docker inspect central-service-1 | grep "com.docker.compose.project.working_dir"
should do the trick.

Hope you (or someone out there) find this helpful.
Cheers!

1 Like

@yanokwa and @aankrah
Thank you so much. I have been desperate, trying to move within the directory and then I noticed I haven´t been in root. Feels like, I didn´t see the forest because of the many trees (German saying).

Now, I have a different issue.

The link for customizing enketo is very helpful, though I don´t know how and where to write the agruments. My goal is to add the google API Key, so that for the map widget, search bar function is working as well as the satelitte images.
My config.json looks like this:

{
    "app name": "Enketo for SUFACHAIN",
    "base path": "-",
    "encryption key": "${SECRET}",
    "id length": 31,
    "less secure encryption key": "${LESS_SECRET}",
    "linked form and data server": {
        "api key": "${API_KEY}",
        "authentication": {
            "type": "cookie",
            "url": "${BASE_URL}/#/login?next={RETURNURL}"
        },
        "name": "ODK Central",
        "server url": "${DOMAIN}"
    },
    "logo": {
        "source": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=",
        "href": ""
    },
    "offline enabled": true,
    "payload limit": "1mb",
    "port": "8005",
    "query parameter to pass to submission": "st",
    "redis": {
        "main": {
            "host": "enketo_redis_main",
            "port": "6379"
        },

Where and how shall I put the google API key?

I only find this code for the map display

[ {
        "name": "street",
        "tiles": [ "http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" ],
        "attribution": "Map data © <a href=\"http://openstreetmap.org\">OpenStreetMap</a> contributors"
    }, {
        "name": "satellite",
        "tiles": "GOOGLE_SATELLITE"
} ]

If this topic has been discussed somewhere already, please feel free to refer me to the thread. :wink:

The order doesn't matter, but I usually put the mapping stuff after support, but before text field character limit. It'll look like this...

    "support": {
        "email": "support@getodk.org"
    },
    "maps": [ {
        "name": "satellite",
        "tiles": "GOOGLE_SATELLITE"
    } ],
    "google": {
        "api key": "my-google-api"
    },
    "text field character limit": 1000000,
    "exclude non-relevant": true

That´s great, so I assume the code block is just always put at the bottom. It will look in total like this for Google map api key and in the map widget 1. Google Satellite and 2. OSM tiles

{
    "app name": "Enketo for [project]",
    "base path": "-",
    "encryption key": "${SECRET}",
    "id length": 31,
    "less secure encryption key": "${LESS_SECRET}",
    "linked form and data server": {
        "api key": "${API_KEY}",
        "authentication": {
            "type": "cookie",
            "url": "${BASE_URL}/#/login?next={RETURNURL}"
        },
        "name": "ODK Central",
        "server url": "${DOMAIN}"
    },
    "logo": {
        "source": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=",
        "href": ""
    },
    "offline enabled": true,
    "payload limit": "1mb",
    "port": "8005",
    "query parameter to pass to submission": "st",
    "redis": {
        "main": {
            "host": "enketo_redis_main",
            "port": "6379"
        },
  "support": {
        "email": "support@getodk.org"
    },
    "maps": [ {
        "name": "satellite",
        "tiles": "GOOGLE_SATELLITE"
  }, {
"tiles": [ "http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" ],
        "attribution": "Map data © <a href=\"http://openstreetmap.org\">OpenStreetMap</a> contributors"
    } ],
    "google": {
        "api key": "my-google-api"
    },
    "text field character limit": 1000000,
    "exclude non-relevant": true

I assume I am wrong with the brackets, right?
Do I need to add a closing at the end?

And I´d like to add, this forum is awesome. :rocket:

2 Likes

This code might be the working code, important: key= at the google API key.

There are two problem I am now facing, it somehow connects, but I cannot zoom within the sattelite map. It only gives the satelitte map on the minZoom level.
And the searchbar for the address does not work.
The OSM map works fine.

@yanokwa: Do I need to set certain TileJSON properties to make it work?

Note: The respective google service are enabled, in the

{
    "app name": "Enketo for [project]",
    "base path": "-",
    "encryption key": "${SECRET}",
    "id length": 31,
    "less secure encryption key": "${LESS_SECRET}",
    "linked form and data server": {
        "api key": "${API_KEY}",
        "authentication": {
            "type": "cookie",
            "url": "${BASE_URL}/#/login?next={RETURNURL}"
        },
        "name": "ODK Central",
        "server url": "${DOMAIN}"
    },
    "logo": {
        "source": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=",
        "href": ""
    },
    "offline enabled": true,
    "payload limit": "1mb",
    "port": "8005",
    "query parameter to pass to submission": "st",
    "redis": {
        "main": {
            "host": "enketo_redis_main",
            "port": "6379"
        }
    },
    "support": {
        "email": "support@getodk.org"
    },
    "maps": [
        {
            "name": "satellite",
            "tiles": "GOOGLE_SATELLITE"
        },
        {
            "tiles": [
                "http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
            ],
            "attribution": "Map data © <a href=\"http://openstreetmap.org\">OpenStreetMap</a> contributors"
        }
    ],
    "google": {
        "api key": "key=my-google-api"
    },
    "text field character limit": 1000000,
    "exclude non-relevant": true
}

For better understanding the problem, here a public link to the survey:

This is the link, and the map widget in the middle.

Hi all,

I´m still struggling with the Google API and getting the search bar working as well as the satellite map.

Anyone an expert who could help a newbie to coding?

Here I explained the problem:

And here is a test link: