styleColorSelectorsText

Colorize the font of the selection. Use "hex" values or "html" color-names.

Specification

Default implementation: { styleColorSelectorsText : ["#000000", "#000000"] }

Key

Name Alias Category 
styleColorSelectorsText style__color__selectors__text Style 

Value

Allow hex values including short writing needs to with starting with #.

Default Validation Type 
["#000000", "#000000"] ^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$ Array 

Example A.

Set font color of selection and others to: ["grey", "lightgrey"]

Output

Open output in a blank window. Download examples as zip.

Parameters

This dataset shows the mobile and desktop google pagerank performance score for a certain website.

  Value Type
Source "../data/performance.json" String
X "name" String
Y [ "mobile", "desktop" ] Array
Options { "styleColorSelectorsText" : ["grey", "lightgrey"], "dataXSelectors" : ["Spock"] } Object

Source Code

  • Invoke Function
d3.statosio( 
    file, 
    "name", 
    [ "mobile",  "desktop" ], 
    { "styleColorSelectorsText" : ["grey", "lightgrey"], "dataXSelectors" : ["Spock"] }
)
  • HTML Implementation
<!DOCTYPE html>
<head>
    <title>d3.statosio - styleColorSelectorsText</title>
    <meta content="text/html;charset=utf-8" http-equiv="Content-Type">
    <meta content="utf-8" http-equiv="encoding">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/6.2.0/d3.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/statosio/0.9/statosio.js"></script>
</head>
<body>
    <script>
        d3.json( "../data/performance.json" )
            .then( ( file ) => {
                d3.statosio( 
                    file, 
                    "name", 
                    [ "mobile",  "desktop" ], 
                    { "styleColorSelectorsText" : ["grey", "lightgrey"], "dataXSelectors" : ["Spock"] }
                )
            } )
    </script>
</body>

Example B.

Set font color of selection and others to: ["#f59351", "#a6b797"]

Output

Open output in a blank window. Download examples as zip.

Parameters

This dataset shows the mobile and desktop google pagerank performance score for a certain website.

  Value Type
Source "../data/performance.json" String
X "name" String
Y [ "mobile", "desktop" ] Array
Options { "styleColorSelectorsText" : ["#f59351", "#a6b797"], "dataXSelectors" : ["Spock"] } Object

Source Code

  • Invoke Function
d3.statosio( 
    file, 
    "name", 
    [ "mobile",  "desktop" ], 
    { "styleColorSelectorsText" : ["#f59351", "#a6b797"], "dataXSelectors" : ["Spock"] }
)
  • HTML Implementation
<!DOCTYPE html>
<head>
    <title>d3.statosio - styleColorSelectorsText</title>
    <meta content="text/html;charset=utf-8" http-equiv="Content-Type">
    <meta content="utf-8" http-equiv="encoding">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/6.2.0/d3.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/statosio/0.9/statosio.js"></script>
</head>
<body>
    <script>
        d3.json( "../data/performance.json" )
            .then( ( file ) => {
                d3.statosio( 
                    file, 
                    "name", 
                    [ "mobile",  "desktop" ], 
                    { "styleColorSelectorsText" : ["#f59351", "#a6b797"], "dataXSelectors" : ["Spock"] }
                )
            } )
    </script>
</body>