Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Colouring a Map by a field in Kepler.gl #2574

Open
stanleybeco opened this issue May 16, 2024 · 0 comments
Open

Colouring a Map by a field in Kepler.gl #2574

stanleybeco opened this issue May 16, 2024 · 0 comments
Labels
bug Something isn't working

Comments

@stanleybeco
Copy link

I would like to colour the map based on the value of Field.

geometry yield
contains geojson coordinates 0.89
contains geojson coordinates 0.6
contains geojson coordinates 0.5

this is what my datasets look like.

A yield with a higher number would give a darker green, and a smaller yield would give a a lighter green.

When the map is loaded, i am able to see the map, and the yield in the tooltip. However the Map doesn't colour based on the yield given. Furthermore, the label of 'Yield Index' isn't appearing.

    const layer = {
      type: 'geojson',
      id: dataset.info.id,
      label: "Yield Index",
      config: {
        dataId: dataset.info.id,
        isVisible: true,
        visConfig: {
          filled: true,
          stroked: true,
          strokeColor: [0, 0, 0],
          lineWidth: 1,
          colorRange: {
            name: 'Green',
            type: 'sequential',
            category: 'Uber',
            colors: ['#d9f0a3', '#addd8e', '#78c679', '#41ab5d', '#238443', '#006837']
          },
        },
        columns: {
          geojson: 'geometry'
        }
      },
      visualChannels: {
        colorField: {
          name: 'yield',
          type: 'real',
          tableFieldIndex: 1,
          id: 'yield'
        },
        colorScale: 'linear',
        sizeField: null,
        sizeScale: 'linear'
      }
    };
    dispatch(
      addDataToMap({
        datasets: [dataset],
        options: {
          centerMap: true,
          keepExistingConfig: false
        },
        info: {
          title: 'Estate Structures Map',
          description: 'This is my map'
        },
        config: {
          mapState: {
            latitude: 3.128299555262178,
            longitude: 113.473405860195,
            zoom: 10,
          },
          visState: {
            layers:[layer]
          }
        }
      })
    );

From my understanding,

  1. visConfig, is to adjust the colour of the WHOLE map

  2. visualChannels, is to adjust the colour by fields.

I have tried putting the colourRange in either visConfig,visualChannels
I have also tried adjusting the tableFieldIndex in colorField

Both don't seem to have any effect. I have been stuck for days, and any help would really be appreciated!

@stanleybeco stanleybeco added the bug Something isn't working label May 16, 2024
@stanleybeco stanleybeco changed the title Colouring a Map by a field in Kepler.gl [Bug] Colouring a Map by a field in Kepler.gl May 16, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

1 participant