Sunday, January 31, 2021

地図の色分け - 欧州

Google Chartを利用し、欧州の地図を表示する。
基本的にはここを参照して記載をすれば良いが、Bloggerで表示するためにCDATAの間にJavascriptを記載する（参照）。
国の名称については、ISO3166に準ずる。
地図に表示する地域は、optionsで指定している。ここではEurope全体を表すために150を指定する。
var options = {region: '150'}; 

    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">

    //<![CDATA[　　　　　　　　　　　　　　　　　　　　　　　　　　
    <!--　

      google.charts.load('current', {
        'packages':['geochart'],
        // Note: プロジェクトのmapsApiKeyを取得する必要があります。
        // See: https://developers.google.com/chart/interactive/docs/basic_load_libs#load-settings
        'mapsApiKey': 'AIzaSyD-9tSrke72PouQMnMX-a7eZSW0jkFMBWY'
      });
      google.charts.setOnLoadCallback(drawRegionsMap);

      function drawRegionsMap() {
        var data = google.visualization.arrayToDataTable([
          ['Country', 'Popularity'],
          ['Germany', 600],
          ['UK', 500],
          ['Belgium', 400],
          ['Spain', 500],
          ['FR', 200]        ]);
        //描画オプション：描画地域などを設定できる。
        var options = {region: '150'};
        //地図を描画するための要素を指定する。
        var chart = new google.visualization.GeoChart(document.getElementById('regions_div'));
        //地図を描画する
        chart.draw(data, options);
      }
      //-->　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　
      //]]>　　
    </script>

    <div id="regions_div" style="width: 500px; height: 500px;"></div>    
Region Oprions 
  • 005 - (South America)
  • 013 - (Central America)
  • 021 - (North America)
  • 002 - (All of Africa)
  • 017 - (Central Africa)
  • 015 - (Northern Africa)
  • 018 - (Southern Africa)
  • 030 - (Eastern Asia)
  • 034 - (Southern Asia)
  • 035 - (Asia/Pacific region)
  • 143 - (Central Asia)
  • 145 - (Middle East)
  • 150 - (Europe)
  • 151 - (Northern Asia)
  • 154 - (Northern Europe)
  • 155 - (Western Europe)
  • 039 - (Southern Europe)
on No comments:

Saturday, January 30, 2021

emacsのタブ設定


プログラミングで、それぞれ好みのタブの設定がある。
私は2 or 4が好みですが、emacsのデフォルトは8でした。
emacsでタブの設定を変えるには、
　M-x customize-option
の後、
　tab-width
で設定する。次の画面でTab Widthを好きな数字に設定し、上部リボンの
Save & Applyを行えばOK。













Read more »
on No comments:
Labels: ,

p5.jsで絵を書こう

p5.jsを使ってProcessingのクリエイティブコーディングをJavaScriptで書く。

まずはお試し

　オンラインのエディタが用意されているので、まずはここで練習。
　円を書くにはこんな感じ。

function setup() {
  createCanvas(400, 400);
}

function draw() {
  background(220);
  ellipse(120,120,80,80);
}

初心者向けのプログラムはこのあたりからお勉強。


ライブラリのダウンロード

こちらからp5.jsをダウンロード。









p5.jsを使ってProcessingのクリエイティブコーディングをJavaScriptで書く。


on No comments:
Labels: , , ,

地図の色分け - グローバル

Google Chartを利用し、全世界の地図を表示する。
基本的にはここを参照して記載をすれば良いが、Bloggerで表示するためにCDATAの間にJavascriptを記載する（参照）。
--- ↓地図を表示 ---

--- ↑地図を表示 ---
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">

    //<![CDATA[　　　　　　　　　　　　　　　　　　　　　　　　　　
    <!--　

      google.charts.load('current', {
        'packages':['geochart'],
        // Note: プロジェクトのmapsApiKeyを取得する必要があります。
        // See: https://developers.google.com/chart/interactive/docs/basic_load_libs#load-settings
        'mapsApiKey': 'AIzaSyD-9tSrke72PouQMnMX-a7eZSW0jkFMBWY'
      });
      google.charts.setOnLoadCallback(drawRegionsMap);

      function drawRegionsMap() {
        var data = google.visualization.arrayToDataTable([
          ['Country', 'Popularity'],
          ['Germany', 200],
          ['United States', 300],
          ['Brazil', 400],
          ['Canada', 500],
          ['France', 600],
          ['RU', 700]
        ]);
        //描画オプション：描画地域などを設定できる。
        var options = {};
        //地図を描画するための要素を指定する。
        var chart = new google.visualization.GeoChart(document.getElementById('regions_div'));
        //地図を描画する
        chart.draw(data, options);
      }
      //-->　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　
      //]]>　　
    </script>

    <div id="regions_div" style="width: 500px; height: 500px;"></div>
on No comments:

BloggerでJavascriptを書く

BloggerでJavaScriptを有効にするには、CDATA + コメントの間にJavaScriptを書く。 
<script type="text/javascript">　　　　　　　　　　　　　　　　　
//<![CDATA[　　　　　　　　　　　　　　　　　　　　　　　　　　
<!--　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　
  document.write("　⇒ここが、document.writeで出力したテキスト行");
//-->　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　
//]]>　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　
</script>　
on No comments:

bloggerにおけるJavaScriptやCSSコードを書くときの注意点

 Bloggerでは、

　<!-- コード-->                        　　　               

の形式のコメントアウトが使えない。このためこれを、

　&lt;!-- コード-->&gt;                                      

という風に書き換えて「htmlの編集」に記載するとOK。


Read more »
on No comments:
Labels:

emacsのインストール on chromebook

emacsをchromebookで使う。

Emacsのインストール
sudo apt-get install emacs

mozcのインストール
sudo apt-get install emacs-mozc emacs-mozc-bin


日本語の設定
以下の設定で、C-\　で日本語の切り替えができるようになった。
; Add path
(add-to-list 'load-path "~/.emacs.d/lisp")

; Mozc settings
(require 'mozc)
(set-language-environment "Japanese")
(setq default-input-method "japanese-mozc")
(setq mozc-candidate-style 'overlay)
【参考】パッケージの読み込み
emacsのパッケージを読み込むために、サーバに接続する設定をすると後々いろいろ拡張できるみたい。bind-keyなどで、設定が変更できる。
~/.emacs.d/initl.elの先頭に、以下を記載。
;; package管理 ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
(package-initialize)
(setq package-archives
      '(("gnu" . "http://elpa.gnu.org/packages/")
        ("melpa" . "http://melpa.org/packages/")
        ("org" . "http://orgmode.org/elpa/"))) 
参考：
https://www.oyunowakusei.net/2017/03/chromebook-install-emacs.html
bind-keyをインストール（参照）すると、設定が楽になるみたい。


on No comments:
Labels: ,

code-server

オープンソースのアプリ。ブラウザ上でVS codeを動かすことができる。
$ sudo apt update $ && sudo apt upgrade -y
インストール
$ curl -fsSL https://code-server.dev/install.sh | sh
code-serverの起動（&をつけてbgで起動、127.0.0.1へ繋げられるように。）
$ code-server &
 info  Wrote default config file to ~/.config/code-server/config.yaml
 info  code-server 3.8.0 c4610f7829701aadb045d450013b84491c30580d
 info  Using user-data-dir ~/.local/share/code-server
 info  Using config file ~/.config/code-server/config.yaml
 info  HTTP server listening on http://127.0.0.1:8080 
 info    - Authentication is enabled
 info      - Using password from ~/.config/code-server/config.yaml
 info    - Not serving HTTPS 
別のターミナルを起動し、以下のコマンドを入力
cat ~/.config/code-server/config.yaml

bind-addr: 127.0.0.1:8080
auth: password
password: d7b348f241xxxxxxxxx
cert: false
初回起動時にランダムに生成されるパスワードを確認する。
ChromeブラウザのURL http://127.0.0.1:8080 または http://localhost:8080 へアクセス



config.yamlに記載のパスワード（上記catで確認したもの）を入力すればOK。





Read more »
on No comments:
Labels: , , ,

Monday, January 25, 2021

MariaDB（MySQL）をインストール 

MariaDBは世界でもっとも普及しているオープンソースのRDBMSであるMySQLから派生したレーショナルデータベース（説明）。
松尾研データサイエンティスト講座で必要なためインストール。

# mariadbをインストール 

$ sudo apt install mariadb-server

# サーバの起動
> sudo systemctl start mariadb
> sudo systemctl enable mariadb # 任意
# 確認
> mysql --version


＜参考＞
MariaDBとは　https://www.system-exe.co.jp/mariadb01/
インストール、MariaDBサーバの起動　https://qiita.com/ponsea/items/9578659009b434c60959）
他
インストール　https://mariadb.org/howto-run-mariadb-on-a-chromebook/

起動　https://swiftfe0.hatenablog.com/entry/2017/10/15/095739












on





No comments:
  


































          

        

          

        

Sunday, January 24, 2021


          

        









ブラウザ上にソースコードをそのまま表示











サンプルコードをHTMLに書きたいときは、<pre>〜</pre>、<code>〜</code>を使う
#サンプルコード：
import numpy as np
# test
a = np.arange(10)
print(a)




<参考>
http://www.hp-stylelink.com/news/2013/08/20130821.php
https://code-kitchen.dev/html/pre/












on





No comments:
  


















Labels:

















        

      









Subscribe to:
Comments (Atom)