Skip to content

'Declutter' property not available on RLayerVector component from within Typescript files #291

@mchadwick94

Description

@mchadwick94

I have been using the 'declutter' property on my RLayerVector components within JavaScript (.js) react components with no issues as below:

import React from "react";
import { RLayerVector } from "rlayers";
import { GeoJSON } from "ol/format";
import arrowUp from "../image.svg";

const Component: React.FC<Props> = (props) => {

  return (
    <RLayerVector
      zIndex={5}
      format={new GeoJSON({ featureProjection: "EPSG:3857" })}
      url={"source-url"}
      declutter={true}
      visible={true}
      style={() => {
        return new Style({
          image: new Icon({
            src: arrowUp, // Arrow image source
            rotation: 0, // Rotation to align with the line direction
            scale: 0.1, // Adjust the size of the image
          }),
        });
      }}
    />
  );
  
};

export default Component;

However I am now starting to use TypeScript (.tsx) components and the 'declutter' prop isn't available to be used within them, and the following exception is shown:

Type '{ zIndex: number; format: GeoJSON; url: string; declutter: boolean; visible: true; }' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<RLayerVector> & Readonly<RLayerBaseVectorProps> & Readonly<...>'.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions