現在、携帯電話で撮影した写真にGPS情報を付加してメールによってあるところへ送り、それらの画像やその他の情報をGPS情報からgooglemap上の位置にマーカでプロットしてユーザが投稿した写真をウェブブラウザ上で閲覧できるようなシステムを作っています。
仕様は、メールを受信したらタイトルや本文、送信者のアドレス、送信日時、位置情報、さらに画像ファイル名(添付画像は画像ファイル用のフォルダに保存される)をxmlファイルに出力するような仕様になっています。
画像から読んだ位置情報からgooglemapにマーカを表示させて、マーカをクリックするとふきだしに受信したメールのタイトルを表示することはできました。
しかし、クリックしたらふきだしにサムネイル画像も表示できたらいいなと考えていてやろうとしたのですができなくて困ってます。
やりたいことのイメージはこんな感じです。↓
http://hvs.dyndns.org/PosPos/PC/
北海道あたりにあるカメラのアイコンをクリックしてみてください。
参考になるページのソースを見てこうすればできるんじゃないかと思ったので下記のような感じでやってみたのですが、
○htmlのscriptタグ内で、まずは画像ファイル名をxmlから読み込んでくるのではなく、画像ファイル名を指定して表示させようと、
var html = markers[i].getAttribute("subject") + "<br />" + "<a href='./debui.jpg' target='_blank'>" + <img src='./debui.jpg' width="120" height="102" \/></a>";
このような記述をしたのですが、これに対してエラーが出てしまい地図さえ表示されない状態です。(泣)
何が違うかわかりますか?
こういう書き方は許されてないんですか?
でしたらどのような記述をすればできるのか教えてください。
お願いします。
No.1ベストアンサー
- 回答日時:
記載URLのPosPos/PCを作ったひゅ~と言います。
スクリプト内では文字列を記述するクォーテーション(シングル、ダブル)の関係をしっかり確認して下さい。どのようなエラーが出ているのかが質問からは読み取れませんが、JavaScriptはプログラムですので雑な記述は通りません。固定文字列を記述するクォーテーションが正しく関係付けられている事が必要です。
質問内のコードでは <img...の前に"が足りていないですし、その中身も混乱しているようです。修正してみると、
+ "<img src='./debui.jpg' width='120' height='102' /></a>";
このようになります。文字列を"で始めた場合はその内部では'を使うのが良いでしょう。
この回答への補足
ひゅ~さんのご指摘どおり、やってみました。
すると、firefoxではエラー: missing ; before statement
ソースファイル: http://localhost:8080/ページのアドレス
行: 91, 列: 137
ソースコード:
var html = markers[i].getAttribute("subject") + "<br />" + "<a href='./debui.jpg' target='_blank'>" + "<img src='./debui.jpg' width="120" height="102" \/></a>";
とのエラーが表示され、IEでは
ライン:90
文字:138
エラー:';'がありません
url:何々
というエラーが出ました。
まだ何かおかしいでしょうか?
ご回答ありがとうございます。
また、参考URLの作者さんから回答いただけるとは・・・うれしいです。
ご指摘の通りやってみます。
それでもなお出来なければ補足にでもエラーの内容など記載してみたいと思います。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- 防犯カメラ・監視カメラ・小型カメラ VHSを高画質な動画ファイルにしたいです。 3 2022/05/06 12:08
- AJAX 自作の地図をグーグルマップのようにしたい 3 2022/11/15 11:53
- JavaScript ①入力フォーム→②確認表示画面→③送信完了画面のコードを書いているのです、 入力フォームから受け取っ 2 2022/05/10 16:45
- Excel(エクセル) エクセル VBA For Next 繰り返しの書き方を教えてください 6 2022/09/01 14:11
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
- PHP htmlspecialcharsが機能していないです。 バグですか? 1 2022/04/05 01:22
- Windows 8 Route Generator の使い方 1 2023/05/03 00:36
- JavaScript jQueryで同じクラス名のものを別物として扱いたい 1 2022/06/17 14:14
- Excel(エクセル) excelで検索した商品の画像(ネットワーク上の)を表示させたい。 3 2023/06/28 00:32
- Excel(エクセル) エクセル、画像ファイル名の書かれたセル(複数個所)に画像を一括で表示させる方法 1 2023/04/19 00:19
関連するカテゴリからQ&Aを探す
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
カーソルを合わせると文字が出...
-
画像+リンク&文字のランダム...
-
ボタンを押したままにする。
-
CSSなどでHTML全体の表示を拡大...
-
スライドショーの上にロゴマー...
-
複数のボタンで1つのエリアに...
-
Safariのalt属性
-
セキュリティで保護されたWebペ...
-
クリックしても、リンクに飛ば...
-
カウンターのHTMLソースを教え...
-
リンクの上にマウスカーソルを...
-
SEOの観点から見たalt属性の文字数
-
タイトルバーに画像を入れるHTM...
-
HTML文書 画像の保存の仕方
-
画像についてるフレームを消し...
-
j-phone用のweb作製しているの...
-
相互リンクにおけるバナー・テ...
-
<img src="相対パス">の絶対パ...
-
スマホで、画像をクリックする...
-
画像を押すことによって音楽を...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
ボタンを押したままにする。
-
IMGタグでTIFF画像を表示
-
背景が透明なリンクボタンで、...
-
カーソルを合わせると文字が出...
-
タイトルバーに画像を入れるHTM...
-
拡張子無しで画像を表示したいです
-
クリックしても、リンクに飛ば...
-
pngやjsの後ろの英数字の意味は...
-
複数のボタンで1つのエリアに...
-
バナーの貼り方とバナーにリン...
-
「DecareステートメントにPtrSa...
-
崩れたレイアウトが更新すると...
-
リンクの上にマウスカーソルを...
-
サムネイル(画像)をクリックす...
-
windowsは画像にマウスオンで画...
-
form以外でのpostってできますか?
-
onmouseoverに複数の命令を書き...
-
正規表現でリンクタグを削除す...
-
HTMLにQRコードを挿入する方法
-
画像を入れ替える方法
おすすめ情報