Help with script


#1

Hey guys, im brand new to openframeworks…wondering if I can get some pointers/help with this particular script.
Im looking to utilize https://github.com/wearenocomputer/ncGoogleQuickDrawToPng/blob/master/src/ncQuickDrawImageSave.cpp
which takes google’s quickdraw drawings and saves them as pngs.
What I am hoping to do instead is to save each individual stroke of the drawing as its own separate png…is that possible?
I’m assuming it has something to do with
stroke.draw();

Cheers


How can I smooth output polylines?
#2

I don’t know exactly how this addon and API works but as I can see there are two methods to save image to .png. One takes a vector of ofPolyline ( all individual strokes of the drawing ?) and saves it to the image. The second one takes only one ofPolyline. Maybe try to change it in the ofApp::update() where addImage method is called.
Something like this:

if (quickdraw.allstrokes.size() > 0) {
   for (auto &stroke : allstrokes) {
      imagesaver.addImage(stroke, counter);
  }
}

#3

Thanks for the reply! So we are looking at this right: https://github.com/wearenocomputer/ncGoogleQuickDrawToPng/blob/master/src/ofApp.cpp
(just to make sure)
Am I to replace line 19, 20, 21 with what you have written?


#4

I downloaded it. Here’s a solution.

Add this line to ncQuickDrawImageSave.h

void addImage(ofPolyline & stroke, int _maincounter, int _counter);

Add this to ncQuickDrawImageSave.cpp

void ncQuickDrawImageSave::addImage(ofPolyline & stroke, int _maincounter, int _counter) 
{
    image.begin();
	ofClear(255, 255, 255, 255);
	ofSetColor(0, 0, 0, 255);
	stroke.draw();
	ofSetColor(255);
	image.end();
	
	ofPixels pix;
	image.readToPixels(pix);
	ofSaveImage(pix, ofToDataPath("output/" + foldername + "/" + ofToString(_maincounter) + "_" + ofToString(_counter) + ".png"));
}

And some changes in ofApp.cpp

void ofApp::update() {

	if (counter == quickdraw.allstrokes.size()) {
		return;
	}
	quickdraw.clientmutex.lock();
	int strokesCounter = 0;
	if (quickdraw.allstrokes.size() > 0) {
		// this saves whole image
		imagesaver.addImage(quickdraw.allstrokes[counter], counter);

		// this saves all parts of the image
		for (auto &stroke : quickdraw.allstrokes[counter]) {
			imagesaver.addImage(stroke, counter, strokesCounter);
			strokesCounter++;
		}
	}
	quickdraw.clientmutex.unlock();
	counter++;
}

#5

Thanks so much man. So I’ve made all of these changes, I think to compile it into an exe I need Visual Studio community 2015, is that right? Or any Visual studio with c++ for that matter


#6

yes, follow this guide:
http://openframeworks.cc/setup/vs/


#7

Alright, working on it now. Ill tell ya if I run into any issues


#8

Hey, so Im a bit confused as how to load up the project using the project generator. I put the ofxjson folder in the addons folder, I believe thats right…but where do I put the main project: https://github.com/wearenocomputer/ncGoogleQuickDrawToPng (the custom version you’ve helped me with) ?
update: I may have got it but im getting these errors: https://imgur.com/a/BYYB5


#9

Hi there, you should put the ncGoogleQuickDrawToPng inside a folder inside the apps folder, so two levels down from the of directory.


#10
  1. put the addon folder (ofxJSON) inside the addons folder
  2. put the project folder wherever you want i.e. inside the apps folder
  3. using project generator point to the app folder (ncGoogleQuickDrawToPng), choose the addons and click update
  4. compile the project
  5. make some modifications described above and compile again


#11

Got it! Will try it out this evening, thanks so much!


#12

Ok, I have another (probably alot harder) question. Its perfect that it splits everything into its original strokes, but I dont need everything that looks like the original sketch, only the random lines and shapes of the individual strokes. Basically everything I’ve highlighted here: https://imgur.com/a/1gkU6
So, is there a way to only export the drawings between a certain file size?
At least for the simplified drawing set, it would need to be between 1000 bytes and 1.35kb. Everything over 1.35kb ends up being too close to the full drawing.
Let me know :slight_smile:


#13

If a size of a file is a proper way of detection which image is good or not, you can check the size of the saved image and delete it after that.

 void ncQuickDrawImageSave::addImage(ofPolyline & stroke, int _maincounter, int _counter) 
{
	image.begin();
	ofClear(255, 255, 255, 255);
	ofSetColor(0, 0, 0, 255);
	stroke.draw();
	ofSetColor(255);
	image.end();

	ofPixels pix;
	image.readToPixels(pix);
		
	std::string fileName = "output/" + foldername + "/" + ofToString(_maincounter) + "_" + ofToString(_counter) + ".png";
	ofSaveImage(pix, ofToDataPath(fileName));

	ofFile f = ofFile(fileName);
	uint64_t fileSize = f.getSize();
	ofLogNotice("file") << fileName << ", size: " << fileSize;
	f.close();

	if ((fileSize < 1000) || (fileSize > 1350)) {
		ofLogNotice("remove file") << fileName << ", size: " << fileSize;
		ofFile::removeFile(fileName);
	}
}

Btw, could you tell me something more about your project? What do you want to achieve?


#14

Yeah, so I was inspired by: https://kynd.github.io/infinite_quickdraw/
I want to do it similar to this, but with more control over the individual strokes and where they are placed on the canvas (using processing). Its a bit of a backwards way of doing it, but im pretty new at programming.
He told me he did it using the lineto and curveto functions.
So with the code you have above, this would delete everything below 1kb and everything above 1.35kb?
Where can I integrate what you’ve provided within the main code?


#15

I edited above. Look at the file properties and check the file size outlined below. Modify it if you need to.

This line means all files below 1000 OR all above 1350 bytes.

if ((fileSize < 1000) || (fileSize > 1350)) {

#16

Cheers. Just tried it…not sure if its working quite right just yet, im getting stuff in the 2kb mark…one sec


#17

For some reason its not working for me on my end, im getting stuff over 1.35kb…I just put your code in and hit rebuild. ? Im working with the cactus file at the moment


#18

Delete an old folder first “data/output/”. In Visual Studio hit F5.
I guess you’ve got whole images? Comment this line.

// this saves whole image
//imagesaver.addImage(quickdraw.allstrokes[counter], counter);

#19

Yes! It works for me now. :slight_smile: Hope im not pushing my luck here, what ive also been wondering is if there was a way to make the edges of the strokes smooth…like a vector? (if thats what a vector is) So you could have it on a bigger canvas. For instance, when you zoom in: https://imgur.com/a/PBnnU the images are pixelated. They are less pixelated with the full size dataset, but still so. I noticed there are a few png to svg converters on github, so maybe one of those might work such as: https://github.com/fabiensanglard/png2svg
Im going to read up on it


#20

Try to modify this size first. Maybe it will be helpful.

void ncQuickDrawImageSave::start(string _foldername){
	foldername = _foldername;
	image.allocate(300, 280);
}

Good luck and good night :slight_smile: