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

Docs: isolate charts in <iframe>s #173

Merged
merged 7 commits into from
Apr 24, 2024
Merged

Conversation

louismaximepiton
Copy link
Member

@louismaximepiton louismaximepiton commented Mar 25, 2024

Note: Please transform - [ ] into - (NA) in the description when things are not applicable

Related issues

Closes #169

Description

Set up examples inside iframes to isolate them from the main page CSS and JS.
Simplify a bit the index.js.
Changing the library (could be done separately) to handle larger markups.

Tried my best using webComponents to encapsulate graphs but the JS leaks outside the webcomponent and leads to issues with the js parts, that are called the number of webcomponent inside a page -> Leads to breaking accordions/tooltips, ...

Turning to iframes that encapsulate JS as well but there are some side effects with echarts and our lib right now. The remaining issue can be seen from the 2 last commits of the branch.

Should we have NONE as an option for the theme ?

Motivation & Context

#169.
Avoid changing the CSS from the whole site to see the rendering with Boosted v4. Simplify the html and js from the doc.

Types of change

  • Refactoring (non-breaking change)

Test checklist

Please check that the following tests projects are still working:

  • docs/examples
  • test/angular-ngx-echarts
  • test/angular-echarts
  • test/html
  • test/react
  • test/vue
  • test/examples/bar-line-chart
  • test/examples/single-line-chart
  • test/examples/timeseries-chart

@louismaximepiton louismaximepiton added the enhancement New feature or request label Mar 25, 2024
Copy link

netlify bot commented Mar 25, 2024

Deploy Preview for ods-charts ready!

Name Link
🔨 Latest commit 061c0c1
🔍 Latest deploy log https://app.netlify.com/sites/ods-charts/deploys/6628ce333439e900080a91bf
😎 Deploy Preview https://deploy-preview-173--ods-charts.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@julien-deramond julien-deramond changed the title Docs: Main lmp boosted 4 fix Docs: isolate charts in <iframe>s Mar 26, 2024
@julien-deramond julien-deramond mentioned this pull request Mar 26, 2024
9 tasks
@louismaximepiton louismaximepiton force-pushed the main-lmp-boosted-4-fix branch from 7eebf9c to 5f36a12 Compare April 8, 2024 22:33
@louismaximepiton louismaximepiton marked this pull request as ready for review April 10, 2024 10:41
@julien-deramond julien-deramond self-requested a review April 24, 2024 06:56
@julien-deramond julien-deramond marked this pull request as draft April 24, 2024 07:49
@louismaximepiton louismaximepiton marked this pull request as ready for review April 24, 2024 08:31
Copy link
Contributor

@julien-deramond julien-deramond left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Niiiiice! Thanks for the PR @louismaximepiton!

@julien-deramond julien-deramond merged commit 07c2c26 into main Apr 24, 2024
4 checks passed
@julien-deramond julien-deramond deleted the main-lmp-boosted-4-fix branch April 24, 2024 09:18
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Docs: Isolate CSS examples in the doc
2 participants