d-goo supercelldinger

コンピュータ、サーバー関係のいろんな覚え書き それと雑談

BootstrapとGoogle Map API併用でcssの落とし穴

BootstrapでwebレイアウトされているページにGoogle Map APIをそのまま入れ込んだ場合、Mapのツールバーの表示がつぶれていまったりします。

bootstrap.min.css が影響しているようです。

こんな感じ

f:id:d-goo:20130819101028p:plain

解消方法

例えばid= map にマップを表示させている場合は

#map のcssに下記を追加することで解消できます。

#map img {max-width: none}

f:id:d-goo:20130819101550p:plain

グーグルマップAPI コピペしてすぐ使えるサンプル1

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>グーグルマップAPI コピペしてすぐ使えるサンプル1</title>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<style>
/*マップの表示スタイル*/
#map{width:800px; height:600px; margin:auto}
/*マップ内情報窓の表示スタイル*/
.info_window{width:200px; height:150px;}
</style>
</head>
<body>
<div id='map'></div>
<script type='text/javascript'>
<!--

    var geocoder = new google.maps.Geocoder();
        geocoder.geocode({
            address: '大阪府大阪市中央区大阪城1−1 ', //マップに表示させたい住所またはランドマーク名を記入
            region: 'jp'
        }, function(results, status) {
            if (status == google.maps.GeocoderStatus.OK) {  //住所から経緯度を書き出し
                var bounds = new google.maps.LatLngBounds();
                for (var r in results) {
                    if (results[r].geometry) {
                        var latlng = results[r].geometry.location;
                        bounds.extend(latlng);
                        var address = results[0].formatted_address.replace(/^日本, /, '');
                       
                        //情報窓の設定 contentの中にHTMLタグやテキストを自由に記入可能
                        new google.maps.InfoWindow({
                            content: "<p class='info_window'>"+address + "<br><a href='http://www.osakapark.osgf.or.jp/hfm_park/02osakajo/index.html'>大阪城公式HP</a><br><img src='https://mw2.google.com/mw-panoramio/photos/medium/739674.jpg' width='150'></p>",
                            title:"大阪城です"
                            }).open(map, new google.maps.Marker({
                            position: latlng,
                            icon: '../img/pin.png',  //マップの表示アイコンを好きな画像に変更可能です。
                            map: map
                        }));
                    }
                }
               
                map.fitBounds(bounds);
                map.setZoom(10); //デフォルトの表示倍率を指定でいます。
            }
        });

    var map = new google.maps.Map(document.getElementById("map"), { //mapというidに表示しています。
        mapTypeId: google.maps.MapTypeId.ROADMAP
    });
//-->
</script>
</body>
</html>

サンプル1

 

Illustorator 覚え書き 塗りつぶし

適当に3つ描画してみる。

背景色は無色。

f:id:d-goo:20130815185952p:plain

 

次のcommand+A で全選択。パスをアウトライン化

f:id:d-goo:20130815190151p:plain

ウィンドウからパスファインダを選択して表示させる。

f:id:d-goo:20130815190334p:plain

 

パスファインダの形状モードで合体(左端)をクリック。

オブジェクトから複合パスを解除。

f:id:d-goo:20130815190617p:plain

 どの部分も塗りつぶしできるようになる。

f:id:d-goo:20130815190759p:plain

 

背景色のある描画から描き始めるとこれがどうもうまくいかないの。

 

 

qmailの必須設定ファイルを再確認

必須設定ファイルその1

/var/qmail/control/me

# vi /var/qmail/control/me

xxxmydomain.com

これはこのqmailサーバーのホスト名だから問題なし。

 

必須設定ファイルその2

/var/qmail/control/rcpthosts

# vi /var/qmail/control/rcpthosts

d-goo.com
.d-goo.com
dgdg.info
.dgdg.info
xxxmydomain.com
.xxxmydomain.com

ヴァーチャルドメイン全て記載されているので問題なし。

その他のファイルは特に設定していないけど送信、受信に問題ないのでよいかな。

ただ設定中にあれこれテストメールを送受信して、その時に届いてなかったメールで受信トレイが埋もれたww

qmailadmin もでけた!!

f:id:d-goo:20130811003104p:plain

ドメインの追加はqmailサーバーから

# /home/vpopmail/bin/vadddomain [ドメイン名] [postmasterのパスワード]

# ls /home/vpopmail/domains/  ←作成したドメインの確認

xxxx.com xxxxxx.jp ドメイン名が表示されたらOK!

後はメアドの追加、変更などはqmailadmin側でやるとすごく楽だ。