# 01_Chart.js
# 1-1_Google Sheets 를 이용한 JSON
-> (/Users/devgwang/WorkSpace/ljkstudio_html/public_html/js/plugins/chartjs/chart-script.js)
# 1-2_MySQL 를 이용한 JSON
# 02_SendBird JavaScripts
# 03_ToPDF PHP (or JavaScript)
# 04_AddingMenu (plus button & minus button)
# 05_
2017년 7월 31일 월요일
Exporting JSON From Google Sheets& JSON to chartJS
->
JSON data -> Chart.js
http://microbuilder.io/blog/2016/01/10/plotting-json-data-with-chart-js.html
Google Sheets 에 DATA 를 JSON 으로 변경한 후에 이를 Chart JS 를 이용하여
CHART 로 변경 한다.
DATA 의 확장성을 고려 하지 아니한다.
그리고 MySQL 를 사용할때에도 JSON 을 사용할 예정이기 때문에
큰 문제가 될거라 생각하지 않는다.
JSON data -> Chart.js
http://microbuilder.io/blog/2016/01/10/plotting-json-data-with-chart-js.html
Google Sheets 에 DATA 를 JSON 으로 변경한 후에 이를 Chart JS 를 이용하여
CHART 로 변경 한다.
DATA 의 확장성을 고려 하지 아니한다.
그리고 MySQL 를 사용할때에도 JSON 을 사용할 예정이기 때문에
큰 문제가 될거라 생각하지 않는다.
2017년 7월 30일 일요일
00_Intro JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
|
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
#selected{
color:red;
}
.dark {
background-color:black;
color:white;
}
.dark #selected{
color:yellow;
}
</style>
</head>
<body>
<ul>
<li>HTML</li>
<li>CSS</li>
<li id="selected">JavaScript</li>
</ul>
<input type="button" onclick="document.body.className='dark'" value="dark" />
</body>
</html>
| cs |
오늘 부터 배울 내용은 Web Browser 에서의 JavaScript의 활용.
2017년 7월 7일 금요일
import ketai.ui.*;
import android.view.MotionEvent;
KetaiGesture gesture;
PImage compass_img,compass_img2;
int r, y;
float scaleFactor = .04;
PFont f;
void setup() {
size(displayWidth, displayHeight,P3D);
// background(20);
//size((displayWidth-30),(displayHeight-30), P3D);
background(20);
f = createFont("Arial",24,true);
orientation(LANDSCAPE);
gesture = new KetaiGesture(this);
noStroke();
// 1
y = height;
}
void draw() {
background(0);
textFont(f);
textAlign(RIGHT);
fill(0,0,200);
text("Text_test#1.",width-100,100);
fill(150,0,0);
text("Text_test#2.",width-100,150);
fill(0,200,0);
text("Text_test#3.",width-100,200);
fill(200,100,100);
text("Text_test#4.",width-100,250);
fill(0,200,100);
text("Text_test#5.",width-100,300);
compass_img= loadImage("HYU_initial_eng.png");
int img_size = 160;
image(compass_img, width-200, 320, img_size, img_size/3);
//image(compass_img, 900-img_size/2, 570-img_size/2, img_size, img_size/3);
compass_img2= loadImage("ljk_logo2.png");
image(compass_img2, width-200, 400, img_size, img_size/2);
//image(compass_img2, 900-img_size/2, 470-img_size/2, img_size, img_size/2);
lights(); // 2
translate(width*0.4, displayHeight*0.3); // 3
scale(scaleFactor); // 4
//scale(0.3);
//rotateX(PI); // 5
rotateY(radians(r/10)); // 6
//box(10); // 7
drawMap();
}
void drawMap()
{
float i=0;
float j=0;
float lenth=displayWidth;
float lenth2=displayHeight;
float sep=20.0;
strokeWeight(2);
stroke(lenth);
fill(255); //white line
while(i<lenth) {
i=i+(lenth/sep);
j=j+(lenth2/sep);
line(i,lenth2,0,i,lenth2,lenth);
line(0,lenth2,i,lenth,lenth2,i);
line(0,j,0,lenth,j,0);
line(i,0,0,i,lenth2,0);
line(0,j,0,0,j,lenth);
line(0,0,i,0,lenth2,i);
}
pushMatrix();
strokeWeight(5);
stroke(0,lenth,0);
line(0, lenth2, 0, lenth, lenth2, 0);
fill(0,100,0);
text("X Axis",lenth2,lenth2,0);
popMatrix();
pushMatrix();
strokeWeight(5);
stroke(lenth,0,0);
line(0, lenth2, 0, 0, 0, 0);
rotate(-HALF_PI);
fill(255,0,0);
text("Y Axis",-lenth2+100,-5,0);
popMatrix();
pushMatrix();
strokeWeight(5);
stroke(0,0,lenth);
line(0, lenth2, 0, 0, lenth2, lenth);
rotateY(-HALF_PI);
fill(0,0,255);
text("Z Axis",lenth2-100,lenth2,0);
popMatrix();
objectdraw();
}
void onPinch(float x, float y, float d) // 8
{
scaleFactor += d/5000;
//scaleFactor=0.3;
scaleFactor = constrain(scaleFactor, 0.01, .3);
//int a=1/100;
//scaleFactor = constrain(a, 0.01, .3);
println(scaleFactor);
} //zoom in
void mouseDragged() // 9
{
if (abs(mouseX - pmouseX) < 50)
r += mouseX - pmouseX;
if (abs(mouseY - pmouseY) < 50)
y += mouseY - pmouseY;
} //motion rotated
public boolean surfaceTouchEvent(MotionEvent event) {
super.surfaceTouchEvent(event);
return gesture.surfaceTouchEvent(event);
}
void objectdraw(){
y=displayHeight;
pushMatrix(); //anchor 1
translate(600, y-600, 600);
noFill();
stroke(255,0,0);
sphere(20);
popMatrix();
pushMatrix(); //anchor 2
translate(100, y-100, 100);
noFill();
stroke(255,255,200);
sphere(20);
popMatrix();
pushMatrix(); //anchor 3
translate(250, y-250, 250);
noFill();
stroke(0,0,255);
sphere(20);
popMatrix();
pushMatrix(); //anchor 4
translate(400, y-400, 400);
noFill();
stroke(0,255,0);
sphere(20);
popMatrix();
}
피드 구독하기:
글 (Atom)