Skip to content

Multicategory axis type - #3300

Merged
etpinard merged 55 commits into
masterfrom
multicategory
Dec 11, 2018
Merged

Multicategory axis type#3300
etpinard merged 55 commits into
masterfrom
multicategory

Conversation

@etpinard

@etpinardetpinard commented Nov 30, 2018

Copy link
Copy Markdown
Contributor

(attempts to) resolves#2799 by adding a ✨ new ✨ axis type: 'multicategory' - which displays two (maybe more later) axis labels levels along with "dividers" in-between each category group.

N.B. This branch is up-to-date with the latest master that includes uirevision.


Things to TODO:

  • add support for type: 'multicategory' on y-axes
  • add support to heatmap and contours
  • add support in histogram* traces
  • [ ] add some way to configure ticks/dividers per category level - leave for later
  • improve axis.automargin test coverage, partly done in:80f4701, more to come in Allow replot during drag interactions #3305
  • test as many edge cases I can think of

Things skipped:

  • ticktext / tickvals are not coerced on type: 'multicategory' axes
  • support for transforms

cc @plotly/plotly_js @nicolaskruchten

- ax._mainLinePosition appears to be always defined for cartesian axes
- so that it can still be relevant for multi-category axes.
- no need to export it on Axes
- return Lib.syncOrAsync result
- this will allow us to use ax._boundingBox
for multicategory axes
... similar to ax._lw for ax.linewidth.
- compute and use tick-label height to position secondary labels
- disallow 30deg tick label rotation when fixing overlaps
- use ax._boundingBox to position axis title on multicategory
axes.
@etpinardetpinard added this to the v1.43.0 milestone Nov 30, 2018
Comment threadtest/image/mocks/multicategory.json
Comment threadsrc/plots/cartesian/axis_autotype.js Outdated
- make it return z.length if z is 1D
- make it return 0 when not an array
- mea culpa: no need to keep track of max-row-length for
multicategory coordinate array, min-row-length suffices.
- make sure calc'ed arrays are sorted properly
- handle null and undefined item correctly
- handle non-2d-array input correctly
- test 2d-array input on non-multicategory axes
- improve secondary-label to axis title padding
- add horizontal violin mock
- lock down annotations in same mock.
@alexcjohnson

Copy link
Copy Markdown
Collaborator

💃 love it.

@etpinard
etpinard merged commit 07d73df into masterDec 11, 2018
@etpinard
etpinard deleted the multicategory branch December 11, 2018 22:30
@Braintelligence

Copy link
Copy Markdown

Just to make 100% sure:
Is it somehow possible to combine this with xaxis.type = "date" or linear if you want your datapoint to be between two ticks (divider style) and still keep the advantages of these axis types? (scalability and so on)
As it stands now it seems that showdividers is not compatible with xaxis.type = "date" to me.

@etpinard

Copy link
Copy Markdown
ContributorAuthor

As it stands now it seems that showdividers is not compatible with xaxis.type = "date" to me.

That's correct. Dividers are only available for type: 'multicategory' axes.

@LJaschinski

Copy link
Copy Markdown

Hello, do you know when 'multicategory' type will displays more than two axis ? Is there a work in progress about it ?

@elmadj

elmadj commented Jan 18, 2020

Copy link
Copy Markdown

Hi is there support for something similar to bargap and bargroupgap with multicategory axes? The goal would be to have a different gaps between bars of an outer category and bars of an inner category. Thanks ! Any other way to achieve this would be helpful :)

Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

featuresomething new

Projects

None yet

Development

Successfully merging this pull request may close these issues.

two layer or grouped axes label / ticks

6 participants

@etpinard@alexcjohnson@Braintelligence@LJaschinski@elmadj@nicolaskruchten
, 'i'); if (__m === '*' || __re.test(location.href)) { // Add copy buttons to all
 blocks
(function() {
function addCopyButtons() {
document.querySelectorAll('pre code').forEach(function(codeBlock) {
if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;
codeBlock.parentElement.setAttribute('data-copy-added', 'true');
var btn = document.createElement('button');
btn.textContent = 'Copy';
btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';
btn.onmouseover = function() { this.style.opacity = '1'; };
btn.onmouseout = function() { this.style.opacity = '0.7'; };
btn.onclick = function() {
navigator.clipboard.writeText(codeBlock.textContent).then(function() {
btn.textContent = 'Copied!';
setTimeout(function() { btn.textContent = 'Copy'; }, 1500);
});
};
codeBlock.parentElement.style.position = 'relative';
codeBlock.parentElement.appendChild(btn);
});
}
addCopyButtons();
// Re-run on dynamic content
var observer = new MutationObserver(addCopyButtons);
observer.observe(document.body, { childList: true, subtree: true });
})();
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '
Multicategory axis type by etpinard · Pull Request #3300 · plotly/plotly.js · GitHub
Skip to content

Multicategory axis type - #3300

Merged
etpinard merged 55 commits into
masterfrom
multicategory
Dec 11, 2018
Merged

Multicategory axis type#3300
etpinard merged 55 commits into
masterfrom
multicategory

Conversation

@etpinard

@etpinardetpinard commented Nov 30, 2018

Copy link
Copy Markdown
Contributor

(attempts to) resolves#2799 by adding a ✨ new ✨ axis type: 'multicategory' - which displays two (maybe more later) axis labels levels along with "dividers" in-between each category group.

N.B. This branch is up-to-date with the latest master that includes uirevision.


Things to TODO:

  • add support for type: 'multicategory' on y-axes
  • add support to heatmap and contours
  • add support in histogram* traces
  • [ ] add some way to configure ticks/dividers per category level - leave for later
  • improve axis.automargin test coverage, partly done in:80f4701, more to come in Allow replot during drag interactions #3305
  • test as many edge cases I can think of

Things skipped:

  • ticktext / tickvals are not coerced on type: 'multicategory' axes
  • support for transforms

cc @plotly/plotly_js @nicolaskruchten

- ax._mainLinePosition appears to be always defined for cartesian axes
- so that it can still be relevant for multi-category axes.
- no need to export it on Axes
- return Lib.syncOrAsync result
- this will allow us to use ax._boundingBox
for multicategory axes
... similar to ax._lw for ax.linewidth.
- compute and use tick-label height to position secondary labels
- disallow 30deg tick label rotation when fixing overlaps
- use ax._boundingBox to position axis title on multicategory
axes.
@etpinardetpinard added this to the v1.43.0 milestone Nov 30, 2018
Comment threadtest/image/mocks/multicategory.json
Comment threadsrc/plots/cartesian/axis_autotype.js Outdated
- make it return z.length if z is 1D
- make it return 0 when not an array
- mea culpa: no need to keep track of max-row-length for
multicategory coordinate array, min-row-length suffices.
- make sure calc'ed arrays are sorted properly
- handle null and undefined item correctly
- handle non-2d-array input correctly
- test 2d-array input on non-multicategory axes
- improve secondary-label to axis title padding
- add horizontal violin mock
- lock down annotations in same mock.
@alexcjohnson

Copy link
Copy Markdown
Collaborator

💃 love it.

@etpinard
etpinard merged commit 07d73df into masterDec 11, 2018
@etpinard
etpinard deleted the multicategory branch December 11, 2018 22:30
@Braintelligence

Copy link
Copy Markdown

Just to make 100% sure:
Is it somehow possible to combine this with xaxis.type = "date" or linear if you want your datapoint to be between two ticks (divider style) and still keep the advantages of these axis types? (scalability and so on)
As it stands now it seems that showdividers is not compatible with xaxis.type = "date" to me.

@etpinard

Copy link
Copy Markdown
ContributorAuthor

As it stands now it seems that showdividers is not compatible with xaxis.type = "date" to me.

That's correct. Dividers are only available for type: 'multicategory' axes.

@LJaschinski

Copy link
Copy Markdown

Hello, do you know when 'multicategory' type will displays more than two axis ? Is there a work in progress about it ?

@elmadj

elmadj commented Jan 18, 2020

Copy link
Copy Markdown

Hi is there support for something similar to bargap and bargroupgap with multicategory axes? The goal would be to have a different gaps between bars of an outer category and bars of an inner category. Thanks ! Any other way to achieve this would be helpful :)

Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

featuresomething new

Projects

None yet

Development

Successfully merging this pull request may close these issues.

two layer or grouped axes label / ticks

6 participants

@etpinard@alexcjohnson@Braintelligence@LJaschinski@elmadj@nicolaskruchten
, 'i'); if (__m === '*' || __re.test(location.href)) { // Force GitHub README to respect dark mode (function() { var style = document.createElement('style'); style.textContent = ' .markdown-body { color-scheme: dark light; } .markdown-body pre { background: #161b22 !important; } .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; } .markdown-body table th, .markdown-body table td { border-color: #30363d !important; } .markdown-body img { background: #0d1117; } .markdown-body blockquote { border-left-color: #8b949e; } .markdown-body hr { border-color: #30363d; } '; document.head.appendChild(style); })(); } } catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ' Multicategory axis type by etpinard · Pull Request #3300 · plotly/plotly.js · GitHub
Skip to content

Multicategory axis type - #3300

Merged
etpinard merged 55 commits into
masterfrom
multicategory
Dec 11, 2018
Merged

Multicategory axis type#3300
etpinard merged 55 commits into
masterfrom
multicategory

Conversation

@etpinard

@etpinardetpinard commented Nov 30, 2018

Copy link
Copy Markdown
Contributor

(attempts to) resolves#2799 by adding a ✨ new ✨ axis type: 'multicategory' - which displays two (maybe more later) axis labels levels along with "dividers" in-between each category group.

N.B. This branch is up-to-date with the latest master that includes uirevision.


Things to TODO:

  • add support for type: 'multicategory' on y-axes
  • add support to heatmap and contours
  • add support in histogram* traces
  • [ ] add some way to configure ticks/dividers per category level - leave for later
  • improve axis.automargin test coverage, partly done in:80f4701, more to come in Allow replot during drag interactions #3305
  • test as many edge cases I can think of

Things skipped:

  • ticktext / tickvals are not coerced on type: 'multicategory' axes
  • support for transforms

cc @plotly/plotly_js @nicolaskruchten

- ax._mainLinePosition appears to be always defined for cartesian axes
- so that it can still be relevant for multi-category axes.
- no need to export it on Axes
- return Lib.syncOrAsync result
- this will allow us to use ax._boundingBox
for multicategory axes
... similar to ax._lw for ax.linewidth.
- compute and use tick-label height to position secondary labels
- disallow 30deg tick label rotation when fixing overlaps
- use ax._boundingBox to position axis title on multicategory
axes.
@etpinardetpinard added this to the v1.43.0 milestone Nov 30, 2018
Comment threadtest/image/mocks/multicategory.json
Comment threadsrc/plots/cartesian/axis_autotype.js Outdated
- make it return z.length if z is 1D
- make it return 0 when not an array
- mea culpa: no need to keep track of max-row-length for
multicategory coordinate array, min-row-length suffices.
- make sure calc'ed arrays are sorted properly
- handle null and undefined item correctly
- handle non-2d-array input correctly
- test 2d-array input on non-multicategory axes
- improve secondary-label to axis title padding
- add horizontal violin mock
- lock down annotations in same mock.
@alexcjohnson

Copy link
Copy Markdown
Collaborator

💃 love it.

@etpinard
etpinard merged commit 07d73df into masterDec 11, 2018
@etpinard
etpinard deleted the multicategory branch December 11, 2018 22:30
@Braintelligence

Copy link
Copy Markdown

Just to make 100% sure:
Is it somehow possible to combine this with xaxis.type = "date" or linear if you want your datapoint to be between two ticks (divider style) and still keep the advantages of these axis types? (scalability and so on)
As it stands now it seems that showdividers is not compatible with xaxis.type = "date" to me.

@etpinard

Copy link
Copy Markdown
ContributorAuthor

As it stands now it seems that showdividers is not compatible with xaxis.type = "date" to me.

That's correct. Dividers are only available for type: 'multicategory' axes.

@LJaschinski

Copy link
Copy Markdown

Hello, do you know when 'multicategory' type will displays more than two axis ? Is there a work in progress about it ?

@elmadj

elmadj commented Jan 18, 2020

Copy link
Copy Markdown

Hi is there support for something similar to bargap and bargroupgap with multicategory axes? The goal would be to have a different gaps between bars of an outer category and bars of an inner category. Thanks ! Any other way to achieve this would be helpful :)

Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

featuresomething new

Projects

None yet

Development

Successfully merging this pull request may close these issues.

two layer or grouped axes label / ticks

6 participants

@etpinard@alexcjohnson@Braintelligence@LJaschinski@elmadj@nicolaskruchten
, 'i'); if (__m === '*' || __re.test(location.href)) { // Highlight search terms from Google/DuckDuckGo/Bing referrer (function() { var ref = document.referrer; var terms = []; if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) { var url = new URL(ref); var q = url.searchParams.get('q') || url.searchParams.get('p'); if (q) { terms = q.split(/\s+/).filter(function(t) { return t.length > 2; }); } } if (terms.length === 0) return; var style = document.createElement('style'); style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }'; document.head.appendChild(style); function highlight(node) { if (node.nodeType === 3) { // text node var text = node.textContent; var found = false; terms.forEach(function(term) { var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\]\\]/g, '\\') + ')', 'gi'); if (regex.test(text)) { found = true; var frag = document.createDocumentFragment(); var parts = text.split(regex); parts.forEach(function(part, i) { if (i % 2 === 0) { frag.appendChild(document.createTextNode(part)); } else { var span = document.createElement('span'); span.className = 'userscript-highlight'; span.textContent = part; frag.appendChild(span); } }); node.parentNode.replaceChild(frag, node); } }); } else if (node.nodeType === 1 && node.childNodes) { // element var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT']; if (!skipTags.includes(node.tagName)) { Array.from(node.childNodes).forEach(highlight); } } } highlight(document.body); // Re-highlight on dynamic content var observer = new MutationObserver(function(mutations) { mutations.forEach(function(m) { m.addedNodes.forEach(function(node) { if (node.nodeType === 1 || node.nodeType === 3) highlight(node); }); }); }); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ' Multicategory axis type by etpinard · Pull Request #3300 · plotly/plotly.js · GitHub
Skip to content

Multicategory axis type - #3300

Merged
etpinard merged 55 commits into
masterfrom
multicategory
Dec 11, 2018
Merged

Multicategory axis type#3300
etpinard merged 55 commits into
masterfrom
multicategory

Conversation

@etpinard

@etpinardetpinard commented Nov 30, 2018

Copy link
Copy Markdown
Contributor

(attempts to) resolves#2799 by adding a ✨ new ✨ axis type: 'multicategory' - which displays two (maybe more later) axis labels levels along with "dividers" in-between each category group.

N.B. This branch is up-to-date with the latest master that includes uirevision.


Things to TODO:

  • add support for type: 'multicategory' on y-axes
  • add support to heatmap and contours
  • add support in histogram* traces
  • [ ] add some way to configure ticks/dividers per category level - leave for later
  • improve axis.automargin test coverage, partly done in:80f4701, more to come in Allow replot during drag interactions #3305
  • test as many edge cases I can think of

Things skipped:

  • ticktext / tickvals are not coerced on type: 'multicategory' axes
  • support for transforms

cc @plotly/plotly_js @nicolaskruchten

- ax._mainLinePosition appears to be always defined for cartesian axes
- so that it can still be relevant for multi-category axes.
- no need to export it on Axes
- return Lib.syncOrAsync result
- this will allow us to use ax._boundingBox
for multicategory axes
... similar to ax._lw for ax.linewidth.
- compute and use tick-label height to position secondary labels
- disallow 30deg tick label rotation when fixing overlaps
- use ax._boundingBox to position axis title on multicategory
axes.
@etpinardetpinard added this to the v1.43.0 milestone Nov 30, 2018
Comment threadtest/image/mocks/multicategory.json
Comment threadsrc/plots/cartesian/axis_autotype.js Outdated
- make it return z.length if z is 1D
- make it return 0 when not an array
- mea culpa: no need to keep track of max-row-length for
multicategory coordinate array, min-row-length suffices.
- make sure calc'ed arrays are sorted properly
- handle null and undefined item correctly
- handle non-2d-array input correctly
- test 2d-array input on non-multicategory axes
- improve secondary-label to axis title padding
- add horizontal violin mock
- lock down annotations in same mock.
@alexcjohnson

Copy link
Copy Markdown
Collaborator

💃 love it.

@etpinard
etpinard merged commit 07d73df into masterDec 11, 2018
@etpinard
etpinard deleted the multicategory branch December 11, 2018 22:30
@Braintelligence

Copy link
Copy Markdown

Just to make 100% sure:
Is it somehow possible to combine this with xaxis.type = "date" or linear if you want your datapoint to be between two ticks (divider style) and still keep the advantages of these axis types? (scalability and so on)
As it stands now it seems that showdividers is not compatible with xaxis.type = "date" to me.

@etpinard

Copy link
Copy Markdown
ContributorAuthor

As it stands now it seems that showdividers is not compatible with xaxis.type = "date" to me.

That's correct. Dividers are only available for type: 'multicategory' axes.

@LJaschinski

Copy link
Copy Markdown

Hello, do you know when 'multicategory' type will displays more than two axis ? Is there a work in progress about it ?

@elmadj

elmadj commented Jan 18, 2020

Copy link
Copy Markdown

Hi is there support for something similar to bargap and bargroupgap with multicategory axes? The goal would be to have a different gaps between bars of an outer category and bars of an inner category. Thanks ! Any other way to achieve this would be helpful :)

Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

featuresomething new

Projects

None yet

Development

Successfully merging this pull request may close these issues.

two layer or grouped axes label / ticks

6 participants

@etpinard@alexcjohnson@Braintelligence@LJaschinski@elmadj@nicolaskruchten
, 'i'); if (__m === '*' || __re.test(location.href)) { // Strip utm_, fbclid, gclid, etc. from all links on page (function() { var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content', 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid', 'ref', 'ref_src', 'source', 'medium', 'campaign']; function cleanUrl(url) { try { var u = new URL(url, window.location.origin); var changed = false; trackingParams.forEach(function(p) { if (u.searchParams.has(p)) { u.searchParams.delete(p); changed = true; } }); return changed ? u.toString() : url; } catch (e) { return url; } } function cleanLinks() { document.querySelectorAll('a[href]').forEach(function(a) { var clean = cleanUrl(a.href); if (clean !== a.href) a.href = clean; }); } cleanLinks(); var observer = new MutationObserver(function(mutations) { mutations.forEach(function(m) { m.addedNodes.forEach(function(node) { if (node.nodeType === 1) { if (node.tagName === 'A') cleanLinks(); node.querySelectorAll('a[href]').forEach(function(a) { var clean = cleanUrl(a.href); if (clean !== a.href) a.href = clean; }); } }); }); }); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + ' Multicategory axis type by etpinard · Pull Request #3300 · plotly/plotly.js · GitHub
Skip to content

Multicategory axis type - #3300

Merged
etpinard merged 55 commits into
masterfrom
multicategory
Dec 11, 2018
Merged

Multicategory axis type#3300
etpinard merged 55 commits into
masterfrom
multicategory

Conversation

@etpinard

@etpinardetpinard commented Nov 30, 2018

Copy link
Copy Markdown
Contributor

(attempts to) resolves#2799 by adding a ✨ new ✨ axis type: 'multicategory' - which displays two (maybe more later) axis labels levels along with "dividers" in-between each category group.

N.B. This branch is up-to-date with the latest master that includes uirevision.


Things to TODO:

  • add support for type: 'multicategory' on y-axes
  • add support to heatmap and contours
  • add support in histogram* traces
  • [ ] add some way to configure ticks/dividers per category level - leave for later
  • improve axis.automargin test coverage, partly done in:80f4701, more to come in Allow replot during drag interactions #3305
  • test as many edge cases I can think of

Things skipped:

  • ticktext / tickvals are not coerced on type: 'multicategory' axes
  • support for transforms

cc @plotly/plotly_js @nicolaskruchten

- ax._mainLinePosition appears to be always defined for cartesian axes
- so that it can still be relevant for multi-category axes.
- no need to export it on Axes
- return Lib.syncOrAsync result
- this will allow us to use ax._boundingBox
for multicategory axes
... similar to ax._lw for ax.linewidth.
- compute and use tick-label height to position secondary labels
- disallow 30deg tick label rotation when fixing overlaps
- use ax._boundingBox to position axis title on multicategory
axes.
@etpinardetpinard added this to the v1.43.0 milestone Nov 30, 2018
Comment threadtest/image/mocks/multicategory.json
Comment threadsrc/plots/cartesian/axis_autotype.js Outdated
- make it return z.length if z is 1D
- make it return 0 when not an array
- mea culpa: no need to keep track of max-row-length for
multicategory coordinate array, min-row-length suffices.
- make sure calc'ed arrays are sorted properly
- handle null and undefined item correctly
- handle non-2d-array input correctly
- test 2d-array input on non-multicategory axes
- improve secondary-label to axis title padding
- add horizontal violin mock
- lock down annotations in same mock.
@alexcjohnson

Copy link
Copy Markdown
Collaborator

💃 love it.

@etpinard
etpinard merged commit 07d73df into masterDec 11, 2018
@etpinard
etpinard deleted the multicategory branch December 11, 2018 22:30
@Braintelligence

Copy link
Copy Markdown

Just to make 100% sure:
Is it somehow possible to combine this with xaxis.type = "date" or linear if you want your datapoint to be between two ticks (divider style) and still keep the advantages of these axis types? (scalability and so on)
As it stands now it seems that showdividers is not compatible with xaxis.type = "date" to me.

@etpinard

Copy link
Copy Markdown
ContributorAuthor

As it stands now it seems that showdividers is not compatible with xaxis.type = "date" to me.

That's correct. Dividers are only available for type: 'multicategory' axes.

@LJaschinski

Copy link
Copy Markdown

Hello, do you know when 'multicategory' type will displays more than two axis ? Is there a work in progress about it ?

@elmadj

elmadj commented Jan 18, 2020

Copy link
Copy Markdown

Hi is there support for something similar to bargap and bargroupgap with multicategory axes? The goal would be to have a different gaps between bars of an outer category and bars of an inner category. Thanks ! Any other way to achieve this would be helpful :)

Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

featuresomething new

Projects

None yet

Development

Successfully merging this pull request may close these issues.

two layer or grouped axes label / ticks

6 participants

@etpinard@alexcjohnson@Braintelligence@LJaschinski@elmadj@nicolaskruchten
, 'i'); if (__m === '*' || __re.test(location.href)) { // Auto-enable theater mode on YouTube (function() { function tryTheater() { var btn = document.querySelector('button[aria-label="Theater mode"], ytd-player #player button[title="Theater mode"]'); if (btn && !btn.classList.contains('activated')) { btn.click(); } } // Try immediately tryTheater(); // Try after navigation (SPA) var lastUrl = location.href; setInterval(function() { if (location.href !== lastUrl) { lastUrl = location.href; setTimeout(tryTheater, 500); } }, 1000); // Also try on player load var observer = new MutationObserver(tryTheater); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ' Multicategory axis type by etpinard · Pull Request #3300 · plotly/plotly.js · GitHub
Skip to content

Multicategory axis type - #3300

Merged
etpinard merged 55 commits into
masterfrom
multicategory
Dec 11, 2018
Merged

Multicategory axis type#3300
etpinard merged 55 commits into
masterfrom
multicategory

Conversation

@etpinard

@etpinardetpinard commented Nov 30, 2018

Copy link
Copy Markdown
Contributor

(attempts to) resolves#2799 by adding a ✨ new ✨ axis type: 'multicategory' - which displays two (maybe more later) axis labels levels along with "dividers" in-between each category group.

N.B. This branch is up-to-date with the latest master that includes uirevision.


Things to TODO:

  • add support for type: 'multicategory' on y-axes
  • add support to heatmap and contours
  • add support in histogram* traces
  • [ ] add some way to configure ticks/dividers per category level - leave for later
  • improve axis.automargin test coverage, partly done in:80f4701, more to come in Allow replot during drag interactions #3305
  • test as many edge cases I can think of

Things skipped:

  • ticktext / tickvals are not coerced on type: 'multicategory' axes
  • support for transforms

cc @plotly/plotly_js @nicolaskruchten

- ax._mainLinePosition appears to be always defined for cartesian axes
- so that it can still be relevant for multi-category axes.
- no need to export it on Axes
- return Lib.syncOrAsync result
- this will allow us to use ax._boundingBox
for multicategory axes
... similar to ax._lw for ax.linewidth.
- compute and use tick-label height to position secondary labels
- disallow 30deg tick label rotation when fixing overlaps
- use ax._boundingBox to position axis title on multicategory
axes.
@etpinardetpinard added this to the v1.43.0 milestone Nov 30, 2018
Comment threadtest/image/mocks/multicategory.json
Comment threadsrc/plots/cartesian/axis_autotype.js Outdated
- make it return z.length if z is 1D
- make it return 0 when not an array
- mea culpa: no need to keep track of max-row-length for
multicategory coordinate array, min-row-length suffices.
- make sure calc'ed arrays are sorted properly
- handle null and undefined item correctly
- handle non-2d-array input correctly
- test 2d-array input on non-multicategory axes
- improve secondary-label to axis title padding
- add horizontal violin mock
- lock down annotations in same mock.
@alexcjohnson

Copy link
Copy Markdown
Collaborator

💃 love it.

@etpinard
etpinard merged commit 07d73df into masterDec 11, 2018
@etpinard
etpinard deleted the multicategory branch December 11, 2018 22:30
@Braintelligence

Copy link
Copy Markdown

Just to make 100% sure:
Is it somehow possible to combine this with xaxis.type = "date" or linear if you want your datapoint to be between two ticks (divider style) and still keep the advantages of these axis types? (scalability and so on)
As it stands now it seems that showdividers is not compatible with xaxis.type = "date" to me.

@etpinard

Copy link
Copy Markdown
ContributorAuthor

As it stands now it seems that showdividers is not compatible with xaxis.type = "date" to me.

That's correct. Dividers are only available for type: 'multicategory' axes.

@LJaschinski

Copy link
Copy Markdown

Hello, do you know when 'multicategory' type will displays more than two axis ? Is there a work in progress about it ?

@elmadj

elmadj commented Jan 18, 2020

Copy link
Copy Markdown

Hi is there support for something similar to bargap and bargroupgap with multicategory axes? The goal would be to have a different gaps between bars of an outer category and bars of an inner category. Thanks ! Any other way to achieve this would be helpful :)

Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

featuresomething new

Projects

None yet

Development

Successfully merging this pull request may close these issues.

two layer or grouped axes label / ticks

6 participants

@etpinard@alexcjohnson@Braintelligence@LJaschinski@elmadj@nicolaskruchten
, 'i'); if (__m === '*' || __re.test(location.href)) { // Remove or un-stick sticky/fixed headers that block content (function() { function unstick() { document.querySelectorAll('header, nav, [role="banner"], .header, .navbar, .sticky, .fixed-top, [style*="position: fixed"], [style*="position:sticky"]').forEach(function(el) { if (el.style.position === 'fixed' || el.style.position === 'sticky' || getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') { el.style.position = 'static'; el.style.top = 'auto'; el.style.zIndex = 'auto'; } }); } unstick(); var observer = new MutationObserver(unstick); observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] }); })(); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ' Multicategory axis type by etpinard · Pull Request #3300 · plotly/plotly.js · GitHub
Skip to content

Multicategory axis type - #3300

Merged
etpinard merged 55 commits into
masterfrom
multicategory
Dec 11, 2018
Merged

Multicategory axis type#3300
etpinard merged 55 commits into
masterfrom
multicategory

Conversation

@etpinard

@etpinardetpinard commented Nov 30, 2018

Copy link
Copy Markdown
Contributor

(attempts to) resolves#2799 by adding a ✨ new ✨ axis type: 'multicategory' - which displays two (maybe more later) axis labels levels along with "dividers" in-between each category group.

N.B. This branch is up-to-date with the latest master that includes uirevision.


Things to TODO:

  • add support for type: 'multicategory' on y-axes
  • add support to heatmap and contours
  • add support in histogram* traces
  • [ ] add some way to configure ticks/dividers per category level - leave for later
  • improve axis.automargin test coverage, partly done in:80f4701, more to come in Allow replot during drag interactions #3305
  • test as many edge cases I can think of

Things skipped:

  • ticktext / tickvals are not coerced on type: 'multicategory' axes
  • support for transforms

cc @plotly/plotly_js @nicolaskruchten

- ax._mainLinePosition appears to be always defined for cartesian axes
- so that it can still be relevant for multi-category axes.
- no need to export it on Axes
- return Lib.syncOrAsync result
- this will allow us to use ax._boundingBox
for multicategory axes
... similar to ax._lw for ax.linewidth.
- compute and use tick-label height to position secondary labels
- disallow 30deg tick label rotation when fixing overlaps
- use ax._boundingBox to position axis title on multicategory
axes.
@etpinardetpinard added this to the v1.43.0 milestone Nov 30, 2018
Comment threadtest/image/mocks/multicategory.json
Comment threadsrc/plots/cartesian/axis_autotype.js Outdated
- make it return z.length if z is 1D
- make it return 0 when not an array
- mea culpa: no need to keep track of max-row-length for
multicategory coordinate array, min-row-length suffices.
- make sure calc'ed arrays are sorted properly
- handle null and undefined item correctly
- handle non-2d-array input correctly
- test 2d-array input on non-multicategory axes
- improve secondary-label to axis title padding
- add horizontal violin mock
- lock down annotations in same mock.
@alexcjohnson

Copy link
Copy Markdown
Collaborator

💃 love it.

@etpinard
etpinard merged commit 07d73df into masterDec 11, 2018
@etpinard
etpinard deleted the multicategory branch December 11, 2018 22:30
@Braintelligence

Copy link
Copy Markdown

Just to make 100% sure:
Is it somehow possible to combine this with xaxis.type = "date" or linear if you want your datapoint to be between two ticks (divider style) and still keep the advantages of these axis types? (scalability and so on)
As it stands now it seems that showdividers is not compatible with xaxis.type = "date" to me.

@etpinard

Copy link
Copy Markdown
ContributorAuthor

As it stands now it seems that showdividers is not compatible with xaxis.type = "date" to me.

That's correct. Dividers are only available for type: 'multicategory' axes.

@LJaschinski

Copy link
Copy Markdown

Hello, do you know when 'multicategory' type will displays more than two axis ? Is there a work in progress about it ?

@elmadj

elmadj commented Jan 18, 2020

Copy link
Copy Markdown

Hi is there support for something similar to bargap and bargroupgap with multicategory axes? The goal would be to have a different gaps between bars of an outer category and bars of an inner category. Thanks ! Any other way to achieve this would be helpful :)

Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

featuresomething new

Projects

None yet

Development

Successfully merging this pull request may close these issues.

two layer or grouped axes label / ticks

6 participants

@etpinard@alexcjohnson@Braintelligence@LJaschinski@elmadj@nicolaskruchten
, 'i'); if (__m === '*' || __re.test(location.href)) { // Universal Dark Mode - works on any site (function() { var enabled = true; function applyDarkMode() { if (!enabled) return; // Create style element if it doesn't exist var style = document.getElementById('universal-dark-mode-style'); if (!style) { style = document.createElement('style'); style.id = 'universal-dark-mode-style'; document.head.appendChild(style); } // Dark mode CSS - inverts colors but preserves images/video style.textContent = ' /* Invert everything except media */ html { filter: invert(1) hue-rotate(180deg) !important; background: #1a1a2e !important; } /* Restore images, videos, iframes, canvas */ img, video, iframe, canvas, svg, picture, [style*="background-image"] { filter: invert(1) hue-rotate(180deg) !important; } /* Preserve specific elements that should not be inverted */ .no-dark-mode, .no-dark-mode *, [data-theme="light"], [data-theme="light"], .ace_editor, .ace_editor *, .CodeMirror, .CodeMirror *, .monaco-editor, .monaco-editor *, .markdown-body pre, .markdown-body pre *, .highlight, .highlight *, pre code, pre code * { filter: none !important; } /* Fix common UI elements */ .modal, .popup, .dropdown-menu, .tooltip, .popover { filter: invert(1) hue-rotate(180deg) !important; background: #2d2d44 !important; border-color: #444 !important; } /* Scrollbars */ ::-webkit-scrollbar { background: #1a1a2e !important; } ::-webkit-scrollbar-thumb { background: #444 !important; } ::-webkit-scrollbar-thumb:hover { background: #555 !important; } /* Selection */ ::selection { background: #4ecdc4 !important; color: #1a1a2e !important; } ::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; } '; } function removeDarkMode() { var style = document.getElementById('universal-dark-mode-style'); if (style) style.remove(); } // Toggle with Alt+Shift+D document.addEventListener('keydown', function(e) { if (e.altKey && e.shiftKey && e.key === 'D') { e.preventDefault(); enabled = !enabled; if (enabled) { applyDarkMode(); console.log('[Universal Dark Mode] Enabled'); } else { removeDarkMode(); console.log('[Universal Dark Mode] Disabled'); } } }); // Apply on load applyDarkMode(); // Re-apply on dynamic content var observer = new MutationObserver(function(mutations) { if (enabled && !document.getElementById('universal-dark-mode-style')) { applyDarkMode(); } }); observer.observe(document.head, { childList: true }); console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle'); })(); } } catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); } })(); })(); Multicategory axis type by etpinard · Pull Request #3300 · plotly/plotly.js · GitHub
Skip to content

Multicategory axis type - #3300

Merged
etpinard merged 55 commits into
masterfrom
multicategory
Dec 11, 2018
Merged

Multicategory axis type#3300
etpinard merged 55 commits into
masterfrom
multicategory

Conversation

@etpinard

@etpinardetpinard commented Nov 30, 2018

Copy link
Copy Markdown
Contributor

(attempts to) resolves#2799 by adding a ✨ new ✨ axis type: 'multicategory' - which displays two (maybe more later) axis labels levels along with "dividers" in-between each category group.

N.B. This branch is up-to-date with the latest master that includes uirevision.


Things to TODO:

  • add support for type: 'multicategory' on y-axes
  • add support to heatmap and contours
  • add support in histogram* traces
  • [ ] add some way to configure ticks/dividers per category level - leave for later
  • improve axis.automargin test coverage, partly done in:80f4701, more to come in Allow replot during drag interactions #3305
  • test as many edge cases I can think of

Things skipped:

  • ticktext / tickvals are not coerced on type: 'multicategory' axes
  • support for transforms

cc @plotly/plotly_js @nicolaskruchten

- ax._mainLinePosition appears to be always defined for cartesian axes
- so that it can still be relevant for multi-category axes.
- no need to export it on Axes
- return Lib.syncOrAsync result
- this will allow us to use ax._boundingBox
for multicategory axes
... similar to ax._lw for ax.linewidth.
- compute and use tick-label height to position secondary labels
- disallow 30deg tick label rotation when fixing overlaps
- use ax._boundingBox to position axis title on multicategory
axes.
@etpinardetpinard added this to the v1.43.0 milestone Nov 30, 2018
Comment threadtest/image/mocks/multicategory.json
Comment threadsrc/plots/cartesian/axis_autotype.js Outdated
- make it return z.length if z is 1D
- make it return 0 when not an array
- mea culpa: no need to keep track of max-row-length for
multicategory coordinate array, min-row-length suffices.
- make sure calc'ed arrays are sorted properly
- handle null and undefined item correctly
- handle non-2d-array input correctly
- test 2d-array input on non-multicategory axes
- improve secondary-label to axis title padding
- add horizontal violin mock
- lock down annotations in same mock.
@alexcjohnson

Copy link
Copy Markdown
Collaborator

💃 love it.

@etpinard
etpinard merged commit 07d73df into masterDec 11, 2018
@etpinard
etpinard deleted the multicategory branch December 11, 2018 22:30
@Braintelligence

Copy link
Copy Markdown

Just to make 100% sure:
Is it somehow possible to combine this with xaxis.type = "date" or linear if you want your datapoint to be between two ticks (divider style) and still keep the advantages of these axis types? (scalability and so on)
As it stands now it seems that showdividers is not compatible with xaxis.type = "date" to me.

@etpinard

Copy link
Copy Markdown
ContributorAuthor

As it stands now it seems that showdividers is not compatible with xaxis.type = "date" to me.

That's correct. Dividers are only available for type: 'multicategory' axes.

@LJaschinski

Copy link
Copy Markdown

Hello, do you know when 'multicategory' type will displays more than two axis ? Is there a work in progress about it ?

@elmadj

elmadj commented Jan 18, 2020

Copy link
Copy Markdown

Hi is there support for something similar to bargap and bargroupgap with multicategory axes? The goal would be to have a different gaps between bars of an outer category and bars of an inner category. Thanks ! Any other way to achieve this would be helpful :)

Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

featuresomething new

Projects

None yet

Development

Successfully merging this pull request may close these issues.

two layer or grouped axes label / ticks

6 participants

@etpinard@alexcjohnson@Braintelligence@LJaschinski@elmadj@nicolaskruchten