Time Dimension Map

Base on Leaflet Time Dimension Package

This Package is build based on leaflet time dimension with some major changes, One limitation is that we only support geojson type of data but it has a better performance for large scale data.

Get Started

Right now, because this package is in private repository, we couldn't use npm or yarn to install it directly, So we should point to the it's repository in package.json file. Go to your project root package.json and under dependencies add this line:

"dependencies": {
    ...
    "@hesaba": "git+https://gitlab.hesaba.co/visualization-infrastructure/react-dashboard-infra",
    ...
}

Then on root directory of projcet run yarn install or npm install

leaflet and react-leaflet are peer dependencies to this library so before you could use this lib you should run yarn install leaflet react-leaflet or npm install leaflet react-leaflet

Basic Usage

This repository you installed containes two seprate packages, One for virtual table and another is Map Time Dimension. Basic useage of time dimension:

import React from 'react';
import HesabaTimeDimension from "@hesaba/packages/map";
import data from "./small_data.json";

export function BasicMap(){
    return(
     <HesabaTimeDimension
        data={data as any}
        mapProps={{
          zoom: 13,
          center: [35.76498031616211, 51.33673858642578] as any,
          zoomControl: false,
        } as any}
        layerProps={{
          updateTimeDimensionMode: "replace",
          duration: "PT2M",
          updateTimeDimension: true,
        }}
      />)
}