wmap's Issues
ヘッダーのメニューが消えてしまう不具合
CSSで固定する
wnewの名前の変更
wnewの中身がわからないため
deploy.sh
deploy.shでデプロイするファイルを指定しているが、不要なファイルを指定して、削除するようにしたほうがミスが少ない気がする
ヘッターバー内のWnewにhomeのリンクを追加
homeに戻る手間を省く
写真
ギャラリー的な何かを表示できるタグ
ホーム画面をわかりやすく改善したい
文字数を減らす、画像を入れるなどしてキャッチーさを保ちたい。
トップページはREADME.mdではなく別のファイルを読み込む
いろいろ不便だった
LICENSEをどうする?
MITにしたいけどLeafletがそうではないので、最適なものがどれなのかを調べる
APIとアプリケーションの分離
CSVやExcelからAPIを生成してgh-pagesを提供する部分を、別のリポジトリにわけたほうがいいかも。
メリット
- アプリケーションのリポジトリがシンプルになる。
- いろんなデータでのデモがやりやすい
- いろんなユースケースを想定しやすくなるかも
デメリット
- ドキュメントの導線がわかりにくくなるかも
- 説明がめんどくさくなるかも
フィールド名にエイリアスを使えるようにする
{
'title': 'タイトル',
'lat': '緯度',
'lng': '経度'
}
みたいな。
iPhoneでメニューの操作性が悪い
Home >
串本 >
...
をタップした時に、個別のページへの遷移に違和感がある。
JSONのキャッシュ対策
CSVからJSONに変換する際に生成されるIDを連番ではなくランダムな固定長の文字列、たとえばmd5などに変更する。
この文字列はgulpを実行するたびに毎回ランダムな値になったほうがいいかも。
CSVにインデックスの付与
重ね重ねすいませんが、CSVの各行をパースしてJSONにする際に数字のIDを付与できません?
現状一番左の列をIDにしてますが、セキュリティ的にやはりきもちわるいので、連番で数字を振ってそれをIDとしてメニューで使いたいなーと。
gh-pagesへの自動デプロイ
情報のジャンルでデータを分ける
観光地の情報といっても色んな分類があると思います。大まかにその情報を小分けにして、入手したいジャンルの情報を抜き出せるようにしたらいいと思います。(例えば「海」、「山」、「体験」といったタグをつける等...)
Need favicons
Prepare favicons, touchicons and etc.
Should external fonts be ignored?
Bootstrap を追加
Bootstrapを追加する
ホーム画面に追加してねってやつ
テーマシステム
Sassで色を変数化してconfig.jsonで選択できるようにする
トップページのコンテンツ
何もないときはこれを表示して、メニューが選択されたら消えるやつ
GeoJSONへの対応
CSVの列にGeoJSONへのパスまたはURLがあればそれを引っ張ってくるみたいな。
ワイヤー&メニュー
CSVのパーサーの修正
CSVのパースの部分のソースをみたんですが、これだと改行付きのCSVとかエスケープに対応してないようなので、オープンソースのパーサーを探してそれをつかったほうがいいかもです。
menu-item > .item をクリックした際に、#data/null にルーティングしてしまうケースがある。
.menu-item > .item をクリックした際、
クリックした場所が文字の上、もしくはアイコンの上をクリックすると #data/null にルーティングが発生してしまう。
UIつくります!
エラーメッセージ
エクセルへの対応
エクセルファイルにも対応する
メニューの下の方にコピーライト的なコンテンツを置くためのタグ
メニューの下の方に作った人の自己紹介を置けるようなタグ
内容はconfig.json
で定義する。
CSVからJSONに変換するGulpプラグインをつくる
CSVのフォーマットは以下のとおり
menu,title,lat.lng,content,...
串本,橋杭岩,12.345,123.45,これは橋杭岩です,...
これを以下のようなフォーマットのJSONに変換する
{
"串本": [
{
"title": "橋杭岩"
"lat": "12.345",
"lng": "123.45",
"content": "これは橋杭岩です"
},
{
...
},
...
]
}
CSSファイルを追加する
エンドポイントURLを指定してCSVファイルやエクセルファイルを取り込む
データのビルドでこういうこともできると、オープンデータ利用の観点からいいかもです。
エンドポイントURLを指定して、データを収穫します。
data/endpoints
http://example.com/example.csv
http://example.com/foo/bar.xlsx
gulpfile.js
const gulp = require( 'gulp' )
const harvest = require( './lib/harvest' )
gulp.task( 'harvest' () => {
harvest( './data/endpoints' )
.pipe( csv2json() )
.pipe( gulp.dest( './json' ) )
} )
クライアントサイドルーターの導入
個別のページにURLを発行する。
OSMを表示するタグ
<open-street-map></open-street-map>
riot.mount( 'open-street-map', {
address: '住所',
lat: 'xxxx',
lang: 'xxxx'
} )
のように住所からでも地図からでもコンテンツを表示できるとベター。
OSMのテスト
この条件分岐をはずす
https://github.com/wakayama-hacker/wnew/blob/master/tags/item-contents.tag#L16
地図が表示されてることをDOMを掘ってテストする
config.json.dist
デフォルトではconfig.json.distを読み込む。もし config.json があればそっちを読み込む。
Distance calculation
距離を近似式で求めるJavaScriptの関数を作ってみました。
現在地と近い順に並べたりするのに使うのであれば、この程度の精度でも良いのではないかと思います。
//calcDistance(緯度1, 経度1, 緯度2, 経度2)
//2点間の距離(km)を近似式で求めます。
//x に紀伊田辺駅(33.733058, 135.384144)と串本駅(33.475527, 135.781603)の距離を求める場合
//x = calcDistance(33.733058, 135.384144, 33.475527, 135.781603);
function calcDistance(n1, t1, n2, t2)
{
var r = 3.1415926535 / 180;
n1 *= r;
t1 *= r;
n1 -= ((11.55 / 60) * r) * Math.sin(2 * n1);
n2 *= r;
t2 *= r;
n2 -= ((11.55 / 60) * r) * Math.sin(2 * n2);
var c = Math.cos(n1) * Math.cos(n2) * Math.cos(t1 - t2) + Math.sin(n1) * Math.sin(n2);
return Math.atan2(Math.sqrt(1 - c * c), c) * 6369;
}
iphone safariで起動時、ピンチインでサイトの形が崩れる
拡大すると勝手にタブが開いてしまう
ヘッダーバーをスクロール時に幅変更
下にスクロールした時にヘッダーバーの幅が広く圧迫感があり、本文が見える範囲が狭く感じる。
pull to reload
csv2json Gulpプラグインの複数のファイルソースへの対応
#9 の子issue
複数のCSVファイルを読み込んで統合できるように修正する。
transform時にファイルへの参照を保持しておき、flushする時に全てのファイルに対して処理をする。
以下のテストケースを追加する。
- 複数のCSVファイルに同じmenuに属する情報が分散している時(一つのmenuのJSONに統合される)
OGPへの対応
Readmeを英語で書く
Read meを英語で記述すれば、海外の方からでも意見が貰えやすくなると思います。
Support localization into other languages
How can Wmap be localized into other languages, such as English?
It would not be a good idea to simply add lots of new columns to the CSV format. For instance, then each top level menu would have to be translated over and over again.
Strings files on Apple platforms are one solution. They provide a mapping of each unique string to its translation for a given language. So this way each top-level menu item only needs to be translated once.
地図のマーカーをクリックしたら地図アプリが開くようにする
csv2json Gulpプラグインの異常系のテスト
#9 の子issue
以下の異常系のテストをする
- csvファイルが空の場合(ファイルは無視される)
- csvファイルのヘッダに
menu
がない場合(ファイルは無視されるべき?) - csvに空白行がある場合(無視される)
- csvのボディの要素数がヘッダーに対して足りない時(当該行は無視されるべき?)
- csvのボディの要素数がヘッダーに対して多い時(多い分は無視される)
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.