Category

2017년 7월 31일 월요일

ToList_ljkstudio_html

# 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_

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 을 사용할 예정이기 때문에
큰 문제가 될거라 생각하지 않는다.


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();
}