Run3 Identify ETF Entries for Conditional Rendering
Create a utility function to reliably detect ETF entries by checking for null/undefined marketCap values, enabling conditional tooltip display and stylingFrom its SKILL.md
npx -y skills add cxcscmu/SkillLearnBench --skill run3_Identify-ETF-Entries-for-Conditional-RenderingAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
SKILL.md
1.3 KB, 267 tokens by cl100k_base, as published. Nobody here has run it
/**
* Determines if a stock entry is an ETF (Exchange-Traded Fund)
* ETFs lack marketCap, country, and website data in the dataset
* @param {Object} d - The stock data object
* @returns {Boolean} true if the entry is an ETF, false otherwise
*/
function isETF(d) {
return d.marketCap === null || d.marketCap === undefined || d.marketCap === '';
}
// Usage in D3 selections:
// - Only show tooltips for non-ETF entries
// - Apply uniform sizing to ETF bubbles
// - Filter conditional event handlers based on ETF status
// Example in bubble creation:
circles
.on('mouseover', function(event, d) {
if (!isETF(d)) {
// Show tooltip only for non-ETF stocks
tooltip.style('display', 'block');
}
})
.on('mouseout', function(event, d) {
if (!isETF(d)) {
tooltip.style('display', 'none');
}
});
Key checks:
- Validate that
d.marketCapis truly null/undefined before assuming ETF status - Use this function consistently across all tooltip and event handler logic
- Test with sample data to confirm ETF entries have no marketCap value
What ships with it
Read from the repository
Just SKILL.md. No reference files, no scripts.