search

sopetrichor / react-photo-collage

MIT License
27 stars 18 forks source link

readme

React Photo Collage

image

Installation

npm install react-photo-collage

Props

Name Type Required Default Description
width string false 800px
height an array of strings false []
layout an array of strings true []
photos an array of strings true []
showNumOfRemainingPhotos boolean true false

Usage

import { ReactPhotoCollage } from "react-photo-collage";

const setting = {
  width: '600px',
  height: ['250px', '170px'],
  layout: [1, 4],
  photos: [
    { source: 'url/image-1.jpg' },
    { source: 'url/image-2.jpg' },
    { source: 'url/image-3.jpg' },
    { source: 'url/image-4.jpg' },
    { source: 'url/image-5.jpg' },
    { source: 'url/image-6.jpg' },
  ],
  showNumOfRemainingPhotos: true
};

function App() {
  return (
    <ReactPhotoCollage {...setting} />
  );
}

Demo

image

React-Photo-Collage-CodeSandbox

Photos courtesy of Unsplash.

Development

npm install
npm run demo