Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
busmap, design, and scripts
Search
kotodu
October 25, 2020
Programming
0
180
busmap, design, and scripts
https://racda25-busmap-zoom.peatix.com/?lang=ja
kotodu
October 25, 2020
Tweet
Share
Other Decks in Programming
See All in Programming
オホーツクでコミュニティを立ち上げた理由―地方出身プログラマの挑戦 / TechRAMEN 2025 Conference
lemonade_37
1
440
No Install CMS戦略 〜 5年先を見据えたフロントエンド開発を考える / no_install_cms
rdlabo
0
440
202507_ADKで始めるエージェント開発の基本 〜デモを通じて紹介〜(奥田りさ)The Basics of Agent Development with ADK — A Demo-Focused Introduction
risatube
PRO
6
1.4k
可変性を制する設計: 構造と振る舞いから考える概念モデリングとその実装
a_suenami
10
1.6k
Claude Code で Astro blog を Pages から Workers へ移行してみた
codehex
0
170
物語を動かす行動"量"
konifar
1
1.1k
バイブスあるコーディングで ~PHP~ 便利ツールをつくるプラクティス
uzulla
1
320
CLI ツールを Go ライブラリ として再実装する理由 / Why reimplement a CLI tool as a Go library
ktr_0731
3
960
バイブコーディングの正体——AIエージェントはソフトウェア開発を変えるか?
stakaya
5
770
WebAssemblyインタプリタを書く ~Component Modelを添えて~
ruccho
1
430
React 使いじゃなくても知っておきたい教養としての React
oukayuka
18
5.3k
CEDEC 2025 『ゲームにおけるリアルタイム通信への QUIC導入事例の紹介』
segadevtech
3
760
Featured
See All Featured
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
139
34k
Balancing Empowerment & Direction
lara
1
530
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
26k
Six Lessons from altMBA
skipperchong
28
3.9k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.4k
The Invisible Side of Design
smashingmag
301
51k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
357
30k
Music & Morning Musume
bryan
46
6.7k
Rebuilding a faster, lazier Slack
samanthasiow
83
9.1k
Testing 201, or: Great Expectations
jmmastey
45
7.6k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
6k
Transcript
バスマップとデザインソフトとスクリプト 不破泰成 ( ことづ @kotodu ) RACDA25 周年記念 バスマップ zoom
会議 発表日 : 2020/10/25
「Illustrator スクリプト開発の苦労話」 「busmap.js の活用方法」 発表概要
不破泰成 ( ことづ ) ・システムエンジニア ( 見習い ) ・JavaScript /
TypeScript / Adobe Illustrator 他 ・Vue.js / React.js / Bootstrap 他 ・フロントエンド / スクリプト開発 ・大学時代にバスマップを制作 人の為に役立つものを はじめに - 自己紹介
・Illustrator でのバスマップ制作 ・バス系統図出力システムの試作 ・Web マップ × バスマップ ・Illustrator スクリプト開発 はじめに
- 取り組んできたこと
Illustrator-Line-Offset ・パスを指定数オフセットする ・半年前に制作したものを改良 ・内部構造の大幅修正 ・開発環境の刷新 はじめに - 直近の実績
busmap.js を活用して バスマップ制作を効率化したい!
・バスマップをプログラムで作成するシステム ・1つ前の発表の「豐多摩研究所」さん制作 ・バスマップの出力やその他有用な機能の提供 ・内部的には、複数の機能の集合体 busmap.js の活用 - busmap.js 概要
経路検索 路線図 デザイン設定 地図への描画 線のオフセット 線の結合 ネットからのデータ取得 停留所並べ替え 地理情報の変換 json
や geojson との変換 データ圧縮 / 展開 原子データ作成 shapes の調整 時刻表 ダイアグラム プログラム群 Web 画面 (busmap.js) busmap.js の活用 - 図解 ( 現在 )
部品 スクリプト 内部修正 Web アプリ 他システム busmap.js の活用 - 図解
( 理想 )
「車輪の再発明はやめて」 既に有用なものがあるのに、 それを使わずに最初から作るのは無駄である ( 画像は別件での discord キャプチャ ) ラクして良いものを作れる busmap.js
の活用 - メリット
busmap.js の部品を Illustrator へ活用したいが……
・高機能な月額制デザインソフト ・スクリプトによる機能のカスタマイズが可能 ・データの流し込みや単純作業の反復に強い ・ベクターデータや PDF データを扱いやすい Adobe Illustrator バスマップ制作に最適 立ちはだかるハードル
- Illustrator
スクリプト CEP 使用の拡張機能 スクリプト Illustrator との窓口 画面 (html,css,js...) 独自配布 /
公式マーケット提供 zxp スクリプトのみの提供 独自配布 jsx 実現できる機能が貧弱…… 立ちはだかるハードル - スクリプト提供の図解
・あまりにもレガシーな JavaScript ・テストやデバッグを行いにくい ・公式による情報が少なく、古く、全て英語 開発者泣かせの Illustrator 複雑な拡張機能の開発は非効率 立ちはだかるハードル - 複雑な開発手法
busmap.js の部品を活用すれば、 拡張機能開発はラクになる?
・コードが難解 ・コメントが乏しく、可読性が低い ・アルゴリズムの記載が乏しく、解読が困難 ・プログラムの分割が困難 ・部品の単体使用が全く想定されていない 立ちはだかるハードル - busmap.js の問題点
現状、busmap.js は活用しにくい
・線同士の結合アルゴリズムを使用 ・Illustrator-Path-Join( 開発中 ) ・Illustrator-Line-Offset ・busmap.js の活用は今後も行いたい おわりに - busmap.js
の小規模な活用例
おわりに •欲しいバスマップを利用者が自作、は理想の1つ? •GISをそのままバスマップに、は利用面で難しい? •ただし「ttrmap」は課題が非常に多い • レイヤーの絶対数、デザイン、機能、データ…… 利用面(+できれば制作面でも)で 、 WEBを活用したバスマップを •欲しいバスマップを利用者が自作、は理想の1つ?
おわりに - 昨年のスライドのおわりに
busmap.js は多方面へ活用可能 busmap.js の構造や難解なコードが、 活用への最大の難所 おわりに - まとめ
bootstrap icon in this slide : ©2020 bootstrap Welcome! ことづ
@kotodu https://kotodu.io ありがとうございました