Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Callback for label colors? #1845

Closed
tony opened this issue Jan 1, 2021 · 1 comment
Closed

Callback for label colors? #1845

tony opened this issue Jan 1, 2021 · 1 comment

Comments

@tony
Copy link

tony commented Jan 1, 2021

Hi, thank you for the project! This is amazing! And it's TypeScript! (And happy new year!)

Here's a sandbox: https://stackblitz.com/edit/zwjmtr?file=index.ts

Description

Briefly: The labelling of colors doesn't accept callbacks but normal coloring does

My personal context: I want to use a callback for labels so I can adjust the color of the text based on background (which I look up via the label name, then run a calculation on): return chroma(dataStore[label.id]).get("lab.l") > 80 ? "black" : "white";

Context: Data.DataColor supports passing a callback:

Example:

var chart = bb.generate({
  data: {
    columns: [
	["data1", 30, 20, 50, 40, 60, 50],
	["data2", 200, 130, 90, 240, 130, 220],
	["data3", 300, 200, 160, 400, 250, 250]
    ],
    type: "bar", // for ESM specify as: bar()
    color: function(color, d) {
	// d will be "id" when called for legends
	return (d.id && d.id === "data3") ?
		d3.rgb(color).darker(d.value / 150).toString() : color;
    },
    labels: {  // However, label coloring doesn't accept color (callback)
      color: function(color, d) {
	// d will be "id" when called for legends
	return (d.id && d.id === "data3") ?
		d3.rgb(color).darker(d.value / 150).toString() : color;
      }
    }
  },
  bindto: "#dataColor"
});

As in the example above, we can fill colors via a callback, but there isn't a reciprocal callback for label colors.

image

Steps to check or reproduce

There isn't a callback for Data.DataLabelColors

Here's a sandbox: https://stackblitz.com/edit/zwjmtr?file=index.ts

tony added a commit to tony/cv that referenced this issue Jan 1, 2021
tony added a commit to tony/cv that referenced this issue Jan 1, 2021
@netil netil added the question label Jan 7, 2021
@netil
Copy link
Member

netil commented Jan 7, 2021

Hi @tony, thanks for the warm comments.
Unfortunately there's no callback support for data.label.colors option for now.

I'll be considering add the feature for the next release.

@netil netil added the request label Jan 7, 2021
netil added a commit to netil/billboard.js that referenced this issue Jan 22, 2021
Enhance data.labels.colors option to support callback function.

Ref naver#1845
@netil netil closed this as completed in ac1affa Jan 22, 2021
github-actions bot pushed a commit that referenced this issue Jan 26, 2021
# [2.2.0](2.1.4...2.2.0) (2021-01-26)

### Bug Fixes

* **api:** fix incorrect legend text positioning ([f1ede3f](f1ede3f)), closes [#1888](#1888)
* **api:** fix zoom for timesries axis ([0421a50](0421a50)), closes [#1868](#1868)
* **arc:** fix setting color value ([fad9e86](fad9e86)), closes [#1857](#1857) [#1847](#1847)
* **axis:** fix incorrect tick interval calculation ([1a96f3e](1a96f3e)), closes [#1896](#1896)
* **axis:** rotated horizontal xAxisHeight is calculated correctly after loading new data ([ef2754f](ef2754f)), closes [#1786](#1786) [#1787](#1787)
* **bar:** fix bar width on zoom ([25e987a](25e987a)), closes [#1907](#1907)
* **bar:** fix bar width rendering for 'total' data key ([eacaecb](eacaecb)), closes [#1818](#1818)
* **browser:** fix referencing global order ([8f84cb3](8f84cb3)), closes [#1778](#1778)
* **browser:** fix retrieving global ([3474ac0](3474ac0)), closes [#1826](#1826)
* **color:** fix color callback mismatch ([86ef214](86ef214)), closes [#1847](#1847)
* **data:** fix data.order to work for arc types ([3a716a0](3a716a0)), closes [#1863](#1863)
* **eventrect:** fix resizing event rect element after .load() ([12bf547](12bf547)), closes [#1864](#1864)
* **eventRect:** fix data.onclick work for scatter/bubble ([109c87d](109c87d)), closes [#1795](#1795)
* **point:** fix usePoint defs id value ([6df4653](6df4653)), closes [#1887](#1887)
* **radar:** fix data label text position ([c69d674](c69d674)), closes [#1871](#1871)
* **text:** data labels are working in Internet Explorer again ([865224e](865224e)), closes [#1877](#1877)
* **tooltip:** fix arc's tooltip interaction ([a8586a3](a8586a3)), closes [#1859](#1859)
* **types:** fix .load() data type ([7108e7b](7108e7b)), closes [#1848](#1848)

### Features

* **api:** make return values for axis.labels() ([efa5174](efa5174)), closes [#1865](#1865)
* **data:** Intent to ship data.label multiline ([8903aa6](8903aa6)), closes [#1784](#1784)
* **data.labels.colors:** Add callback support ([ac1affa](ac1affa)), closes [#1845](#1845)
* **gauge:** added support for drawing gauge from 'startingAngle' to 'arcLength' ([25954ad](25954ad)), closes [#1633](#1633) [#1803](#1803) [#1849](#1849)
* **gauge:** Intent to ship gauge.background ([632c600](632c600)), closes [#1804](#1804)
* **pie:** Intent to ship pie.outerRadius ([ca67418](ca67418)), closes [#1825](#1825)
* **point:** Intent to ship point.opacity ([fc5ad35](fc5ad35)), closes [#1867](#1867)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants