Giter VIP home page Giter VIP logo

Comments (4)

y-takey avatar y-takey commented on May 16, 2024 1

Hi @TheTisiboth , thanks for the issue and a reproducible example :)
I will look into it.

from chartjs-plugin-stacked100.

y-takey avatar y-takey commented on May 16, 2024 1

This is expected behavior, but made negative scale variable.
You can use fixNegativeScale option, after update this plugin to v1.1.0.

<Bar data={data} options={{ plugins: { stacked100: { enable: true, fixNegativeScale: false } } }} />

Thanks for your pointing :)

from chartjs-plugin-stacked100.

TheTisiboth avatar TheTisiboth commented on May 16, 2024 1

Oh great, that is exactly what I was expecting, thank you a lot for your quick fix, that was really fast!!!

from chartjs-plugin-stacked100.

TheTisiboth avatar TheTisiboth commented on May 16, 2024

I found a workaround, but it is rather temporary I would say, since it is not elegant at all.
Anyway, as I said, I get the expected behavior if my react component is refreshed (whenever I update the source code).
So I thought that I could programmatically achieve this, and I found this snippet on the web, which is doing it:

const [, updateState] = useState();
const forceUpdate = useCallback(() => updateState({}), []);

Then, I created a simple plugin that is forcing the update of my component once at the beginning, and that does the trick:

const updatePlugin: Plugin<"bar"> = {
        id: "updatePlugin",
        beforeInit: () => {
            // It will update my component once, just before the chart is initialized
            forceUpdate()
        }
    }

So this is maybe just a React related issue, I'm not sure. If you think that this issue is not related to your plugin, I can of course delete it, no problem!

from chartjs-plugin-stacked100.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.