1. @antv/scale
Toolkit for mapping abstract data into visual representation.
@antv/scale
Package: @antv/scale
Created by: antvis
Last modified: Sun, 28 Apr 2024 09:03:08 GMT
Version: 0.4.15
License: MIT
Downloads: 674,272
Repository: https://github.com/antvis/scale

Install

npm install @antv/scale
yarn add @antv/scale

@antv/scale

Toolkit for mapping abstract data into visual representation. Living Demo ยท ไธญๆ–‡ๆ–‡ๆกฃ

scale mapping

Build Status
Coverage Status
npm Version
npm Download
npm License

โœจ Features

  • Powerful: Ability to customize tickMethod are offered with abundant kinds of scales.
  • High performance: Use different methods to cache some state of scales to improve performance.
  • Fully embrace TypeScript: All code are written in TypeScript and complete type definition files are provided.

scale examples

๐Ÿ“ฆ Installation

 $ npm install @antv/scale

๐Ÿ”จ Getting Started

  • Basic usage
 import { Linear, LinearOptions } from '@antv/scale';

const options: LinearOptions = {
  domain: [0, 10],
  range: [0, 100],
};
const x = new Linear(options);

x.map(2); // 20
x.invert(20); // 2
x.getTicks(); // [0, 2.5, 5, 7.5, 10]
  • Customize tickMethod
 import { Linear } from '@antv/scale';

const x = new Linear({
  domain: [0, 10],
  range: [0, 100],
  tickCount: 3,
  tickMethod: () => [0, 5, 10],
});

x.getTicks(); // [0, 5, 10]

๐Ÿ“ฎ Contribution

 $ git clone [email protected]:antvis/scale.git

$ cd scale

$ npm i

$ npm t

Then send a pull request after coding.

๐Ÿ“„ License

MIT@AntV.

RELATED POST

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin