Highlighted

Mapping JSON data to color ramp

Community Beginner ,
Jun 18, 2020

Copy link to clipboard

Copied

Hi all! I'm trying to map values stored in a JSON file to a colour ramp in AE. Something like:

 

linear(myData.value, value_min, value_max, #FFFFFF, #000081)

 

...in the fill colour property, if the linear expression could be used in this way. So taking a value from my dataset, figuring out where it sits along the colour gradient and applying that fill colour to the shape.

Is there a way to do this with expressions in AE?

Just an update – I managed to make this work using the hexToRgb() expression!

 

linear(myData.value, value_min, value_max, hexToRgb("FFFFFF"), hexToRgb("000081"))

 

TOPICS
Expressions, Scripting

Views

100

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Mapping JSON data to color ramp

Community Beginner ,
Jun 18, 2020

Copy link to clipboard

Copied

Hi all! I'm trying to map values stored in a JSON file to a colour ramp in AE. Something like:

 

linear(myData.value, value_min, value_max, #FFFFFF, #000081)

 

...in the fill colour property, if the linear expression could be used in this way. So taking a value from my dataset, figuring out where it sits along the colour gradient and applying that fill colour to the shape.

Is there a way to do this with expressions in AE?

Just an update – I managed to make this work using the hexToRgb() expression!

 

linear(myData.value, value_min, value_max, hexToRgb("FFFFFF"), hexToRgb("000081"))

 

TOPICS
Expressions, Scripting

Views

101

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Jun 18, 2020 0
Most Valuable Participant ,
Jun 18, 2020

Copy link to clipboard

Copied

No such thing. Controls contained in sub-dialogs and custom controls cannot be accessed with expressions and in many cases not even with scripts when the "data blob" formatting isn't known. That's the iron rule of AE. whatever you have in mind will require a different approach like using the Ramp or Tint effects to colorize your artwork.

 

Mylenium

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jun 18, 2020 0
Adobe Community Professional ,
Jun 19, 2020

Copy link to clipboard

Copied

In expressions, colors are arrays [red,green,blue,alpha] with values between 0 and 1. Linear can work with those. The only thing you need to do is to convert your #FFFFFF to the corresponding array [0,0,0,1].

My free tool mamoworldJSON has this conversion build-in and supports (i.e. converts) color values of the form #FFFFFF to the required arrays out of the box.
If you don't want to use mamoworldJSON and rather implement it yourself - this is how it works:

 

function hexStringToColorArray(val){
var colorString = /([0-9a-fA-F]{6})/.exec(val)[1];
var color = [];
color[0] = parseInt(colorString.substr(0,2),16)/255;
color[1] = parseInt(colorString.substr(2,2),16)/255;
color[2] = parseInt(colorString.substr(4,2),16)/255;
color[3] = 1;
return color;
}
linear(myData.value,value_min,value_max,hexStringToColorArray("#FFFFFF"),hexStringToColorArray("#000081"))

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jun 19, 2020 0
Community Beginner ,
Jun 19, 2020

Copy link to clipboard

Copied

Just an update – I managed to make this work using the hexToRgb() expression!

 

linear(myData.value, value_min, value_max, hexToRgb("FFFFFF"), hexToRgb("000081"))

 

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jun 19, 2020 0
Adobe Community Professional ,
Jun 19, 2020

Copy link to clipboard

Copied

Oh, yes, expressions has its own implementation to convert hex to RGB! So my solution is unnecessarily complicated.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Jun 19, 2020 0