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

There is no getObjects method? #102

Open
gabrielecker opened this issue Dec 7, 2018 · 6 comments
Open

There is no getObjects method? #102

gabrielecker opened this issue Dec 7, 2018 · 6 comments
Labels
Enhancement Enhance performance or improve usability of original features.

Comments

@gabrielecker
Copy link

Version

Version 3.3.0

Development Environment

Ubuntu, Chrome

Current Behavior

Currently there is only one way to get coordinates from objects which is getObjectProperties(id) but this requires an id as a parameter.
I wonder if there is anything similar to get an array with all the objects properties

Expected Behavior

Something like this

getObjectsProperties(['id', 'left', 'top'])
[
  {id: 1, left: 100, top: 100},
  {id: 2, left: 200, top: 200},
...
]
@junghwan-park junghwan-park added the Enhancement Enhance performance or improve usability of original features. label Jan 10, 2019
@junghwan-park
Copy link
Member

@gabrielecker
Okay, I'll consider best way to provide existing canvas objects with simple interface.

@rhanmiano
Copy link

Hi anyone , is there any updates on this feature? I found the need for this method in our use case also where we need to get all the objects and their properties to be saved on a persistent storage so that it can be accessed again. Kindly point me to the right direction, if anyone could help. Thanks!

@rhanmiano
Copy link

rhanmiano commented Feb 19, 2022

I have managed to get the set of objects (along with the needed properties) by inspecting the getInstance() of the component like so on react that uses the @toast-ui/react-image-editor:

// editor ref
const editor = useRef();

// handler that can be bind to `onClick` of an element for inspection or further processing
const handleClick = () => {
    const editorInstance = editor.current?.getInstance();

    let objects = [];

    for (let [key, values] of Object.entries(editorInstance._graphics._objects)) {
      objects.push({...values}); 
    }

    console.log('objects', objects);
};

// the ui editor
<ImageEditor
    ref={editor}
    ...otherProps
/>

The instance contains the _graphics property and inside it is _objects that contains the objects present on the editor.

@lja1018
Copy link
Contributor

lja1018 commented Feb 23, 2022

@rhanmiano
I'm sorry, but it hasn't been updated yet.
Why don't you use imageEditor._graphics.getObjects() instead?

@rhanmiano
Copy link

Hi @lja1018 , thanks for the response. Will try out that one. I thought there was no available method because I just rely on the documentation. Hope you can add that one?

@lja1018
Copy link
Contributor

lja1018 commented Mar 2, 2022

@rhanmiano
Thank you. I think I need it, too. I will think positively.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Enhancement Enhance performance or improve usability of original features.
Projects
None yet
Development

No branches or pull requests

4 participants