상세 컨텐츠

본문 제목

C언어로 워드클라우드 HTML 파일 생성 하기

AI/빅데이터

by cepiloth 2021. 3. 31. 12:10

본문

728x90
반응형

수정한 소스

https://github.com/cepiloth/Word_Cloud-Using-C-

기반소스의 경우 linux gcc 환경에서 작성되어있다.

#include <bits/stdc++.h>
using namespace std;

원본은 bits/stdc++.h 사용하여 아래처럼 Window 환경에 맞게 수정해야 한다.

#include <string>
#include <vector>
#include <fstream>
#include <iostream>
using namespace std;

 

소스 분석

out.txt 파일을 읽어서 stopwords에 정의된 글자가 아닌 경우에 list에 글자와 빈도수를 저장한다.

vector<string> stopwords = {",",".",";","is",
"were","has","we","a","an",
"the","of","from","to","when",
"will","be","at","but","in","and"};

stopwords를 보게 되면 be 동사, 관사 등 명사가 아닌 단어들로 구성되어 있다. 심플하게 만드려고 이렇게 한 게 아닐까 추측된다.

ifstream fi("out.txt");
.
.
.
while (fi >> str) 
{
	// Checking for stopwords
	if (find(stopwords.begin(), stopwords.end(), str) != stopwords.end()) {
		continue;
	}

	found = 0;
	// Searching if word already exists
	for (i = 0; i < list.size(); i++) {
		if (str == list[i].first) {
			found = 1;
			break;
		}
	}

	if (found == 1) {		// Increment Frequency if exists
		list[i].second = list[i].second + 1;
	} else {				// Add to the list if does not exists 
		list.push_back(make_pair(str, 1));
	}
}

 

list에 담긴 명사를 출력하는 부분 인대 html 문서를 만드는 로직이다. 이미지 형태로 만드는 것이 아니라 수집된 단어 리스트를 html span tag로 생성하는 것이다.

fo << "<html>\n<title>Word Cloud</title>\n<link rel=\"stylesheet\" type=\"text/css\" href=\"style.css\">\n</head>\n<body>\n<div class=\"para\">\n";

for ( it = list.begin() ; it != list.end() ; it++) {
	
	if (it->second == 1) {
		fo << "<span class=\"text1\">" + it->first + "</span>\n";
	}
	else if (it->second == 2) {
		fo << "<span class=\"text2\">" + it->first + "</span>\n";
	}
	else if (it->second == 3) {
		fo << "<span class=\"text3\">" + it->first + "</span>\n";
	}
	else if (it->second == 4) {
		fo << "<span class=\"text4\">" + it->first + "</span>\n";
	}
	else if (it->second > 4) {
		fo << "<span class=\"text5\">" + it->first + "</span>\n";
	}
}

fo << "</div>\n</body>\n</html>";

it->second의 값을 보고 각각의 다른 class를 설정한다. style.css 소스를 확인해보니 속성에 따른 글자크기와 색상을 정의되어 있다.

.para {
	text-align: center; vertical-align: middle; font-family:
                    arial; color: white; background-color:black; border:1px solid black;
}
.text1 {
	font-size: 40px;
	color: red;
}
.text2 {
	font-size: 80px;
	color: blue;
}
.text3 {
	font-size: 100px;
	color: yellow;
}
.text4 {
	font-size: 140px;
	color: blue;
}
.text5 {
	font-size: 160px;
	color: green
}

 

출력 결과

 

해당 소스는 빅데이터 알고리즘을 사용하여 워드 클라우드를 만드는 것은 아니고 simple하게 만드는 방법으로 보인다. style.css 소스를 몇 개 수정하여서 다른 출력 결과를 도출해 보았다.

CSS 수정 결과

 

 

728x90
반응형

관련글 더보기

댓글 영역