lucid-ui
Version:
A UI component library from AppNexus.
40 lines • 989 B
JavaScript
import _map from "lodash/map";
import React from 'react';
import { Bars, d3Scale } from '../../../index';
var data = [{
x: 'one',
y: 10
}, {
x: 'two',
y: 100
}, {
x: 'three',
y: 1000
}, {
x: 'four',
y: 10000
}, {
x: 'five',
y: 100000
}];
var width = 750;
var height = 400;
var yScale = d3Scale.scaleLog().domain([1, 1000000]).range([height, 0]);
var xScale = d3Scale.scaleBand().domain(_map(data, 'x')).range([0, width]);
export default function App() {
return /*#__PURE__*/React.createElement("svg", {
height: 600,
width: 1000
}, /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement(Bars, {
data: data,
xScale: xScale,
yScale: yScale
})), /*#__PURE__*/React.createElement("g", null, _map(data, function (item) {
return /*#__PURE__*/React.createElement("text", {
textAnchor: "middle",
x: xScale(item.x) + xScale.bandwidth() / 2,
y: yScale(item.y) - 10,
fill: "gray"
}, item.y);
})));
}