just keep swimming

Numpy library에서 자주 사용되는 함수

• np.array - 배열생성
• np.zeros - 0이 들어있는 배열 생성
• np.ones - 1이 들어있는 배열 생성
• np.empty - 초기화가 없는 값으로 배열을 반환
• np.arange(n) - 배열 버전의 range 함수
• np.random - 다양한 난수가 들어있는 배열 생성

import numpy as np​
array = np.random.randint(0,10,(3,5))  # 0~10까지 3,5 랜덤어레이 생성

매번 까먹어서 이번에는 성공한 기념으로 다시 기록해놓기!

집컴퓨터 계정이름을 한글로 해놔서 C드라이브에 Python을 설치하면 어디선가 오류가 뜨는데 특히 파일 저장하거나 불러올때 한글 인식오류가 많이 뜨는편.

이참에 D:// 드라이브에 새로 설치해보자 싶어 쓰는 글이다.\

윈도우 D드라이브에 파이썬 설치

파이썬 홈페이지(http://www.python.org/downloads)에 들어가면 가장 최근버전을 다운받을 수 있는데

난 최근 버전도 버그만 없다면 잘 쓰는 편이다.

가끔 패키지의 버전 충돌로 다운그레이드 해야할 때가 있지만 왠만해선 잘 일어나지 않음 ㅠㅠ

customize installation 선택

D:드라이브에 본인이 원하는 경로 지정 후 Install 누르면 끝!!!!

커멘드 창에서 jupyter notebook 실행(Window 검색>cmd)

d:     #d://드라이브로 경로이동

python   #python설치 및 버전확인

pip3 install jupyter    # 주피터 노트북 설치 

설치 완료후, 

python -m notebook

그리고 마지막 두줄을 보면, http://localhost:8888~~ e12 까지 복사 후 chrome에서 사용하면 된다.

물론 주피터 경로 역시 d드라이브로 시작함!

오늘은 회사에서 했던 모달창에 동영상 넣는걸 정리해보려합니다.

그래야 머릿속에 저장되겠죠..?

지난번부터 계속 발생하는 오류는 mp4가 폴더path로는 되는데 url로 경로를 바꾸면 안되는데

아무래도 다른 방법으로 접근해야할 것 같습니다.

아래 소스코드 참고하시구요.

위의 아이콘<fa fa-play-circle>을 누르면

이렇게 동영상 팝업이 띄워지고 x 버튼 <fa fa-times> 를 눌러 모달 창을 끌 수 있습니다.

<template>
    <div class="App">
        <div class="col-sm-4">
            <div class="card bg-dark text-white bg-card">
                <div class="card-img-overlay">
                    <p>
                    <button @click = "modal = true" type="button" class="btn btn-link"><i class="fa fa-play-circle" style="color:rgb(85,85,85);font-size:90px;margin:0;text-shadow: 3px 3px 3px rgba(0,0,0,0.8);"></i></button>
                    </p>
                </div>
            </div>
        </div>
                    <div class="black-bg" v-if="modal == true">
                            <div>
                                <button @click="modal = false" class="btn btn-link"><i class="fa fa-times" style="color:rgba(255,255,255,0.5);font-size:30px; position:absolute; top:10px; left:1360px;"></i></button>
                            </div>
                        <!-- <div class="white-bg"> -->
                            <div>
                                <video controls width=1360px; height=660px;>
                                    <source src="../img/SampleVideo_1280x720_5mb.mp4" >
                                    <video tabindex="-1" class="video-stream html5-main-video" controlslist="nodownload" style="width: 127px; height: 226px; left: 136px; top: 0px;" src="blob:https://www.youtube.com/4e179a1f-73da-4047-95f0-66f6adde9676"></video>
                                </video>
                            </div>
                    </div>
    </div>
</template>

<script>
export default {
  name: 'App',
  data () {
    return {
      modal: false
    }
  }
}
</script>
<style>
*{
  text-align: left;
}
p{
  text-align: center;
}
h5{
  text-align: center;
}
/* 모달창 */
body{
  margin :0
}
div{
  box-sizing:border-box;
}
.black-bg {
  z-index: 100;
  width : 1400px; height: 720px;
  background: rgba(0,0,0,1);
  position: fixed; top:70px; left:300px; padding: 10px;
}
.white-bg {
  padding: 10px;
  background: rgba(255,255,255,0.9);
  border-radius: 20px;
  margin-top: 25px;
  margin-left: 10px;
  margin-right: 10px;
}

a {
  color: rgb(255,255,255);
}

.card1
{
padding: 10px;
  background: rgba(240, 231, 218,0.5);
  color: rgb(100,100,100);
}

body {
    margin: 0;
     /* -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"; */
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #8b8b8b;
    text-align: center;
    background-color: #ffffff;
}
</style>

아무리 구글링해도 vue에서 모달 창 넣기는 잘 안나오더라구요 ㅠㅠ 

html로 실행되는 코드는 되게 많은데 ,, 흑흑,,,

저처럼 고민하시는 분들을 위해 vue modal popup 되는 코드 남겨놓겠으니 참고하셔서 꼭 성공하시기 바랍니다 !!

아래 버튼 클릭하면 실행됩니다. 

See the Pen Untitled by mijeong.shin (@mijeongshin) on CodePen.