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

defs and fill not working in Choropleth Map #2068

Closed
francescocretti opened this issue Jul 7, 2022 · 2 comments
Closed

defs and fill not working in Choropleth Map #2068

francescocretti opened this issue Jul 7, 2022 · 2 comments

Comments

@francescocretti
Copy link
Contributor

Thanks for creating and maintaining Nivo.

Describe/explain the bug
I can't use defs and fill properties on Choropleth map

To Reproduce
Such as described in #864, I followed the guide to add a pattern definition to my Map component, but when I define the match rule in the fillprop, this is never applied.

<ResponsiveChoropleth
  data={data}
  features={features}
  margin={{ top: 0, right: 0, bottom: 0, left: 0 }}
  colors={chromaScale}
  domain={domain}
  unknownColor="#fff"
  label="id"
  projectionScale={scale}
  projectionTranslation={translate}
  borderWidth={1}
  borderColor="#152538"
  onClick={onFeatureClick}
  tooltip={({ feature }) => (
      <MapTooltip
        color={feature.color}
        label={feature.id}
        value={feature.formattedValue}
        aggregationType={aggregationType}
      /> 
  )}
  defs={[
    {
      id: "diagonal-stripes",
      background: "inherit",
      color: "#fecd64",
      lineWidth: 3,
      rotation: -45,
      spacing: 7,
      type: "patternLines"
    }
  ]}
  fill={[
    { match: { id: 'Lombardia' }, id: 'diagonal-stripes' }
  ]}
/>
)}

This is an example I tried. I'm sure the feature with id = 'Lombardia is present in my map.

I really don' know what I'm doing wrong.

Any thoughts? Thank you so much.

Additional context

"@nivo/core": "^0.79.0"
"@nivo/geo": "^0.79.1"
    ```
@francescocretti
Copy link
Contributor Author

Looking at the implementation (https://github.com/plouc/nivo/blob/master/packages/geo/src/GeoMap.js) seems like neither defs and fill are passed to the component.

I don't know if I'm looking in the right place, but if this is the case, you should update the documentation removing the defs and fill part or implement this feature in the GeoMap, that would be extremely useful :)

If you give me some pointers maybe I could help

@plouc
Copy link
Owner

plouc commented Sep 10, 2022

Implemented in #2072, and available in the latest release.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants