- Exciting release!Introducing "safe npm". Learn more →
@antv/antv-spec
Advanced tools
- Version published
- Maintainers
- 56
- Weekly downloads
- 359
- decreased by-58.11%
Weekly downloads
Readme
antv-spec
A declarative grammar that supports various technology stacks of AntV.
Features
schema: uniform visualization schema for AntV
adaptor: translate schema to chart library
Installation
npm install @antv/antv-spec
Example
import { useEffect } from "react";
import { AntVSpec, specToG2Plot } from "@antv/antv-spec";
export default function App() {
const chartSpec: AntVSpec = {
basis: {
type: "chart"
},
data: {
type: "json-array",
values: [
{ year: "2007", sales: 28, type: "A" },
{ year: "2008", sales: 55, type: "A" },
{ year: "2009", sales: 43, type: "A" },
{ year: "2010", sales: 91, type: "A" },
{ year: "2011", sales: 81, type: "A" },
{ year: "2012", sales: 53, type: "A" },
{ year: "2013", sales: 19, type: "A" },
{ year: "2014", sales: 87, type: "A" },
{ year: "2015", sales: 52, type: "A" },
{ year: "2007", sales: 34, type: "B" },
{ year: "2008", sales: 52, type: "B" },
{ year: "2009", sales: 70, type: "B" },
{ year: "2010", sales: 11, type: "B" },
{ year: "2011", sales: 46, type: "B" },
{ year: "2012", sales: 79, type: "B" },
{ year: "2013", sales: 23, type: "B" },
{ year: "2014", sales: 54, type: "B" },
{ year: "2015", sales: 99, type: "B" }
]
},
layer: [
{
mark: {
type: "line",
style: { color: "#444444" }
},
encoding: {
x: {
field: "year",
type: "temporal"
},
y: {
field: "sales",
type: "quantitative"
},
color: {
field: "type",
type: "nominal",
scale: {
range: ["#5c0011", "#ffec3d", "#7cb305", "#08979c", "#003a8c"]
}
}
}
}
]
};
useEffect(() => {
specToG2Plot(chartSpec, document.getElementById("container"));
});
return <div className="container"></div>;
}
Documentation
This project is still an alpha version. We eagerly welcome any contribution.
For more usages, please check the Quick API.
FAQs
A declarative grammar that supports various technology stacks of AntV.
The npm package @antv/antv-spec receives a total of 246 weekly downloads. As such, @antv/antv-spec popularity was classified as not popular.
We found that @antv/antv-spec demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 56 open source maintainers collaborating on the project.
Did you know?
Socket installs a Github app to automatically flag issues on every pull request and report the health of your dependencies. Find out what is inside your node modules and prevent malicious activity before you update the dependencies.