「D3.js」を使ったデータビジュアライゼーション
Webやスマートデバイス、センサーなどあらゆるものから情報を収集出来るようになり、世の中には膨大なデータが溢れかえっています。また、ビッグデータやデータサイエンティストといったキーワードに注目が集まり、データ活用への期待が高まっています。しかし、単純に収集したデータはそのままでは見づらく、そこから意味を汲み取ることは困難です。そこで、データの見せ方や伝え方が重要になってきます。 D3.jsとは D3.jsは、Mike Bostock（mbostock）が作成したデータ可視化用途で人気のJavaScriptライブラリで、データをDOMと結びつけ、データ駆動によりグラフを作成することができます。ソースコードはGithubで公開されており、人気を表すStarの数がGithubに公開されているリポジトリ全体で6番目に多いことからも、注目の高さが伺えます（2013/10現在）。ライセンスは修正BSD
jQuery Panorama Viewer - jQuery製のパノラマ写真ビューワー
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました せっかく撮った写真、Webブラウザで楽しみましょう！ iPhoneではパノラマ写真が撮影できるようになって、広範囲を映し出した写真が手軽に撮れるようになりました。しかしパノラマ写真は画像としてみれば単に横幅が広い写真でしかありません。むしろ写真としては見づらいでしょう。 そこで必要になるのは専用のビューワーです。今回はjQueryで作られた、WebベースのパノラマビューワーjQuery Panorama Viewerを紹介します。 jQuery Panorama Viewerの使い方 デモの写真です。マウスでドラッグして左右に移動できます。 実際に動作させているデモです。公式サイトで試用もできます。 iPhoneでパノラマ写真を撮るのは慣れるまで難しいですが、できあがった写真は迫力
40分で覚える！jQuery速習講座 (1/6)
いまやWeb制作に欠かせなくなったJavaScript。でも、「JavaScriptはほとんど“アリモノ”で済ませている」という方も多いのでは？ そこで、WebデザイナーやマークアップエンジニアなどのWeb制作者の方向けに、いま一番人気のJavaScriptライブラリー「jQuery」の基本を学べる特別レッスンをお届けします。題して、「40分で覚えるjQuery」。要点だけにぎゅっと絞って解説しますので、手を動かしながら今すぐjQueryを始めましょう。 【0分目：導入編】 jQueryのダウンロードと利用方法 jQueryのライブラリー本体（JavaScriptファイル）は公式サイトからダウンロードし、head要素などにscript要素を書いて読み込みます。
画像スライドショーでjQueryプラグインの基本を学ぶ
画像スライドショーでjQueryプラグインの基本を学ぶ：jQuery×HTML5×CSS3を真面目に勉強（2）（1/4 ページ） はじめに この連載で取り扱っているjQueryはJavaScriptのライブラリエンジンです。 世の中には実にさまざまなプログラミング言語があります。昨今主流となっているものの大半は、オブジェクト指向プログラミング言語と呼ばれているものです。 代表的な例を挙げると、Java、C#、Ruby、Python、Objective-Cといったところでしょう。これらの言語はクラスベースというカテゴリに属しています。クラスベースはアプリケーションにおけるさまざまな機能をクラスと呼ばれる単位でキッチリと分割することで、プログラム全体をキレイに整理整頓できるという特徴を持っています。大規模な開発になるほど、この特徴が威力を発揮するため、先に挙げたプログラミング言語が積極的に採用
今頃になって Google Maps API v2 から v3 対応へ修正 - Tociyuki::Diary
年末まで仕事が埋まらず、暇になってしまいました。 暇な時間の有効活用のために、まずは長い間 Google Maps API バージョン 2 のまま手つかずだった本館の Google Maps API で RSS 1.0 から地図表示するページをバージョン 3 に対応させることにしました。平日の朝っぱらか、いい年した大人が何をやっているのだろうと我ながら苦笑しつつも、このエントリの作文まで済ませてアップロード。さて、せっかく山下公園のイチョウが黄色になりかけているので、これからデジカメもって日没前に撮ってくることにします。 今回は v3 になってなくなった機能を補完するために、jQuery を使ってみました。Mac OS X 版 safari、同版と ubunutu linux 版 firefox 3.5、ubuntu 版 epiphany で試してみたところ、これらでは問題なく動作している
jQueryで地震分布図を作成しよう
地理情報を含むデータを表現する場合、地図上で表すことで視覚的にその情報を認知しやすくなります。例えば、車のナビや道路標識などでは、単純に方向や座標だけを示すのではなく、地図上に表現することで、見た人が直感的に認知できるようにしています。本稿では、jQuery対応コントロール集である「Ignite UI 2013 Volume 1」のigMapというコントロールを用いて、地震分布図を作成していきます。 対象読者 JavaScriptの経験者、地図アプリに興味のある方。 必要環境 IDEは特に必要がなく、コード編集用のエディタと動作確認用のブラウザがあれば良いです。 今回使用するigMapコントロールは、jQuery UIウィジェットの一つであり、jQueryライブラリとjQuery UIライブラリに依存します。そのため、対応ブラウザについてもjQuery UIに依存します。 プログラム実行時
WordPressにJavascript追加(JQueryなど） | トミリュウ・コム
WordPressにJQueryや自作のJavascriptファイルを追加挿入するやり方としては、 サイト全体（全てのブログ記事）共通で、Javascriptを追加挿入したい場合 サイト内の個別の記事に、Javascriptを追加挿入したい場合 の二つがあると思います。 サイト全体（全てのブログ記事）共通で、Javascriptを追加挿入したい場合 「wp-content/themes/<テーマディレクトリ>/header.php」のファイルをエディタで開き、wp_enqueue_script()という関数をwp_head()の前に埋め込みます。 参考 ： Function Reference/wp enqueue script ワードプレスに最初から入っているJQuery,prototype.jsなどを有効にするには、単純に wp_enqueue_script('jquery'); や
node.jsとjQueryでスクレイピングするウェブアプリの作り方
やっぱ jQuery 便利ですよ(*´・ω・)(・ω・｀*)ﾈｰ セレクタ使って jQuery でダカダカやってると、DOM とか正規表現でネチネチやるのがバカらしくなっちゃいます。 と日頃から思ってたりしてまして、サーバサイド JavaScript がメインストリームになって、jQuery でウェブアプリをコーディングできれば超ラクできるかもと期待しています。 で、先日サーバサイドJavaScriptとjQueryでスクレイピングという記事をうpったところ、やっぱ Rhino じゃなくて node.js がえーんよ(´･ω･｀)というコメントを頂きましたので、node.js と jQuery でサーバサイド JavaScript スクレイピングしてみることにしました。 今回は node.js ですので、単にスクレイピングする（コマンドラインから実行する）スクリプトだけじゃなくて、スクレイ
Rails連携型Webアプリケーションフレームワーク·Joosy MOONGIFT
JoosyはRailsと連携するWebアプリケーションフレームワークです。 Webアプリケーションを開発しようとした際にフロントエンドのフレームワークは多数ありますが、バックエンドはあまり用意されていません。しかしJoosyはRuby on Rails連携型であり、フロントエンド/バックエンドを効率的に開発できるWebアプリケーションフレームワークになっています。 アプリケーションベースを生成します。 この二つのコマンドで準備は完了です。 最初の表示です。 ファイル構成です。 コントローラ部の実装です。 ビューはHAMLで記述します。 JoosyはRailsの中にJavaScriptを使ったMVCフレームワークを組み込みます。肝になるのはCoffeeScript、jQuery、HAMLそしてSuger.jsとなっています。そしてデータをAjaxでサーバサイドとやり取りし、その結果をレンダリ
Webデザイナーのためのjquery入門2（前編）
82 views jQueryの社内勉強会用スライドです。だいたい1時間で終われるように、前編・後編に分けています。 後編は6月以降で公開を予定しています。 More… jQueryの社内勉強会用スライドです。だいたい1時間で終われるように、前編・後編に分けています。 後編は6月以降で公開を予定しています。 このスライドを作るにあたって、書籍「WebデザイナーのためのjQuery入門」をかなり参考にしています。 Webデザイナーのためのjquery入門2（前編） — Presentation Transcript Webデザイナーのための jQuery入門 -覚醒編（前編） -jQueryのコードを自分で考えて書けるようになろう！ 目標 日々の業務にjQueryを取り入れて、 自分で何かを作れるようになる。 大まかな内容１. 何かを取ってくる ２. それに何かをする３. まとめ 1
msto.jp - it転職 リソースおよび情報
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
jQuery mobileはじめの一歩！「jQuery mobileで簡単なページを作成してみる」のまとめ | jQeryMobileでサイトをつくろう
jQuery Mobileの概要 jQuery Mobileは、jQueryをベースとした、スマートフォン向けのフレームワーク※1です。 スマートフォン向けの直観的かつ使いやすいUIを瞬時に作成できます。 ※1フレームワーク：アプリケーション制作の土台を作ってくれるソフトウェアのこと デザイナー好みの「手軽さ」と「自由さ」を兼ね備え、デベロッパーが求める「リッチなヴィジュアル」のスマートフォンUIが作成できます。 指定した形式でHTMLを書くことで、自動的にスマートフォン向けにデザインされたネイティブアプリケーションさながらのページが瞬時にしてできあがります。（jQuery Mobileが作成できるのは、ウェブアプリケーションです。） 2010年10月にアルファ版がリリースされ、2011年11月ついにjQuery Mobile1.0正式版が公開されました。現在も、jQueryの開発者で
jQueryでスクロールすると表示する系いろいろ
Posted: 2012.03.08 / Category: javascript / Tag: jQuery, アニメーション 最近はスクロールするときにいろいろ仕掛けをするのが流行なようです。 ここではシンプルにある要素の位置とか最下部までスクロールしたら何か表示するということをやってみます。 ちょっとスクロールするとフェードして「トップへ戻るボタン」を表示を表示します。 ボタンは下の方にこんな感じで配置します。 html <p id="page-top"><a href="#wrap">PAGE TOP</a></p> fixedにすると固定配置されます。 css #page-top { position: fixed; bottom: 20px; right: 20px; font-size: 77%; } #page-top a { background: #666; text-
最速な JavaScript のリファレンスマニュアルサイトをつくった - tokuhirom's blog
JavaScript のリファレンスマニュアルといえば MDN(Mozilla Developers Network) が有名ですが、MDN の資料は探索がめんどくさいし、表示が遅いということで使い勝手がわるいという問題がありました。 そこで、jQuery のリファレンスマニュアルサイトとして有名な jqapi.com とおなじよような使い勝手のサイトがあったらいいのになーとおもいました。 なので、つくりました。 サイト自体はすべて static なデータで構成されているので、github からデータを取得すれば、イントラや自分のマシン内で閲覧することも可能となっています。 なお IE での動作確認はしていないので、うまくうごかない場合は pull-req してください。
スマートフォンっぽいUIを、JQueryを使わずに作ってみる3 - BASHI_BASHI
前回、スマートフォンっぽいUIを、JQueryを使わずに作ってみる2で、 みたいなボタンを作成しました。 今回は、スマホのUI考 〜 ボタンについてで、 指の大きさの制約を受ける ・Webとスマホを比較した場合、最大の違い。 ・ピクセル単位でクリック位置を制御できるマウスポインタと違い、指は大雑把にしかタップ位置を指定できない。 ・このためAppleはボタンの最小サイズとして44pxというガイドラインを作っている。 ・視覚的に44px以下のボタンも実際のヒットエリアは大きめにする。 と紹介されており、スマフォ用のボタンをつくるときには最低限44pxが必要みたいなのですが、サイトデザインの都合上、どうしても44px以下のボタンを作らねばならぬのだ。。。。 ってときのために、 ・視覚的に44px以下のボタンも実際のヒットエリアは大きめにする。 を、HTMLで書いてみました。 <html lan
jQueryでスマホサイト向けに画像サイズを縮小する方法
jQueryでスマホサイト向けに画像サイズを縮小する方法を紹介します。 １．サンプル 次のようなPCサイト用のページがあります。この場合、Movable Typeでページを出力しています。ページで使っている記事内の画像サイズは幅470pxです。 このページをスマホサイト向けに別のページを作り、画像サイズを縮小して表示します。画像サイズは幅280pxに縮小しています。 ２．カスタマイズ サイズを変更するには、下記のスクリプトをページ内にあるhead終了タグの直前に追加します。 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script> <script type="text/javascript"> jQuery(function(){ $('img').each(functio
俺の2番底 開発日記:datepickerアーカイブ
開発に関するメモ。 主にPerl,MySQL,javascript(jQuery),Linuxとかに関すること。 以前のエントリー http://yoseyo.net/jquery/2008/06/jquerydatepickerjs.html でsample作るといったので。 その２で、変数をセットすれば変わりますが、、、、 設定なし↓ http://yoseyo.net/jquery/sample/datepicker.html 日本語用にカスタム↓ http://yoseyo.net/jquery/sample/datepicker2.html $.datepicker.setDefaults({ showOn: 'button', buttonImageOnly: true, buttonImage: '/mt-static/images/locked.gif', buttonT
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
gmaps.js — Google Maps API with less pain and more fun
ノンプログラマーのためのjQuery入門
http://swapskills.info/2011/07.html