isometric-css

A lightweight JavaScript library to build isometric projections using CSS classes

 

Documentation / Demo

https://elchininet.github.io/isometric-css/

Introduction

To give the apperance of an isometric projection to an HTML element, it is needed to apply CSS transformations to it. This transformations could be complex to manage, and even more when we have multiple elements and we want to translate or rotate them. The isometric-css library can help you with this task, it will create the necessary CSS rules to transform the HTML elements and attach them to the page automatically. You can either apply the transformation through declarative data attributes in the HTML code or use the library API methods to apply the transformations to the elements dynamically using JavaScript.

Changelog

[2.0.0] - 2021-02-10

• Breaking change: The library has been rewritten completely
• Remove jss and jss-plugin-camel-case as dependencies, the styles are managed by the library itself
• The transformations are applied using matrix tranformation instead of skew and rotate tranformations
• It is possible to rotate planes