等高線を図面、報告書、Webページ、説明資料などで再利用するとき、SVGは有力な出力形式です。SVGはXMLを基盤とする二次元グラフィックス形式で、パスや図形をベクターとして保持できるため、固定画素の画像よりも拡大時に形状を保ちやすい特徴があります。ただし、SVGはベクターだけでなくラスター画像も含められる形式です。拡張子がSVGであっても、等高線が画像として埋め込まれていれば、元画像の解像度を超えた拡大でぼけが目立ちます。([W3C][1])
また、等高線がパスで保存されていても、画面表示では最終的にディスプレイの画素へ描画されます。細すぎる線、倍率に対して不適切な線幅、座標の丸めすぎ、過剰な頂点、ぼかしフィルタ、複雑な変換などが重なると、線が柔らかく見える、太さが不ぞろいに感じられる、表示が重くなるといった問題が起こります。SVG化そのものではなく、SVG内部の構造と表示条件を確認することが重要です。
本記事では、等高線をSVGで書き出す際に確認したい5つの設定を、実務上の判断基準とともに解説します。特定のソフトウェアに依存せず、地形図、造成計画図、施工説明資料、Web表示用データなどへ応用できる考え方として整理します。
等高線をSVGで書き出す前に理解したい線ぼけの正体
SVGのパスは、座標と描画属性によって形状を表します。そのため、PNGやJPEGのように一定数の画素だけで輪郭を保持する画像と比べ、拡大時にも曲線形状を再計算して表示できます。ただし、ディスプレイへ表示するときは、ベクター形状も画素へ変換されます。斜線や曲線を滑らかに見せるアンチエイリアス処理によって境界に中間色が置かれるため、細線や中途半端な倍率では、線がわずかにぼけたように見えることがあります。
この見え方は、形状情報そのものが失われた状態とは区別して考える必要があります。SVG内の等高線がパスであり、座標精度が保たれていれば、拡大しても形状情報は維持されます。一方、SVG内のimage要素などで地図画像や画面キャプチャが配置されている場合、その部分は参照元の画素数に依存します。SVGはベクターとラスターを混在できるため、ファイル形式だけでなく、等高線がどの要素で保存されているかを確認する必要があります。([W3C][1])
等高線で問題になりやすいのは、表示寸法に対して線幅が細すぎること、複数の拡大縮小変換が重なっていること、座標桁数を減らしすぎていること、元データの微小な凹凸をそのまま残していること、フィルタや透明度で輪郭を弱めていることです。大きな座標値を直接扱うこと自体が直ちに誤りではありませんが、変換や書き出しを何度も行う処理系では丸め誤差が蓄積する可能性があります。SVG仕様でも座標変換などでは高い精度の計算が推奨されているため、表示用データを適度な座標範囲へ移す方法は、互換性を高める実務上の対策になります。([W3C][2])
品質確認では、最大倍率で輪郭だけを見るのではなく、実際に使用する表示寸法で読みやすいかを確認します。主曲線と計曲線を区別できるか、密集部で線が黒くつぶれていないか、緩斜面で細線が消えていないか、尾根や谷の形状が角ばっていないかを見ます。拡大時の形状保持と、通常表示時の可読性は別の評価項目です。両方を満たす設定を選ぶことが、実務で使いやすいSVGを作る基本です。
設定1 座標範囲とviewBoxを適正化する
最初に確認したいのは、SVG内部で使用する座標範囲とviewBoxです。viewBoxは、SVGのユーザー座標系にある矩形を表示領域へ対応付けるための属性で、min-x、min-y、width、heightの4値によって範囲を定義します。viewBoxを指定すると、その範囲をビューポートへ写す変換が適用されます。([W3C][3])
viewBoxが等高線の外接範囲から大きく外れていると、同じ表示枠の中で必要な地形部分が小さくなります。その結果、線幅が相対的に細く見え、画素への描画時に濃淡が不安定になることがあります。ただし、viewBoxの余白そのものがベクター形状を劣化させるわけではありません。問題は、必要な範囲が意図しない倍率で表示されることです。線ぼけ対策としては、対象範囲、余白、表示寸法、線幅を一体で調整します。
地理座標や平面直角座標系など、大きな数値を持つデータを表示用SVGへ変換する場合は、対象範囲の基準値を差し引き、SVG内の座標を0付近から始まる値へ相対化する方法があります。これはSVGで必須の処理ではありませんが、座標文字列を短くし、複数段階の変換で生じる丸め誤差の影響を抑えやすくします。元の測量座標を復元できるよう、原点オフセット、座標系、単位、変換条件は別途記録します。
相対化したSVGは、閲覧や説明に使う派生データとして扱うのが安全です。元の座標値をSVG上に直接持たせない場合、SVG単体から測量座標を復元できないことがあります。元の等高線データ、座標系情報、変換パラメータを保持し、SVGと対応付けて管理します。
縦横比も重要です。viewBoxの縦横比と表示枠の縦横比が異なる場合、preserveAspectRatioの指定によって余白を残して比率を維持するか、範囲を切り取るか、変形して表示するかが変わります。特にpreserveAspectRatioをnoneにすると、表示枠に合わせて縦横別々の倍率が適用され、地形形状が変形して見える可能性があります。等高線の形状を維持する用途では、縦横比を保つ設定を基本とし、出力後に確認します。viewBoxとpreserveAspectRatioは表示変換に関わるため、幅と高さだけを見て判断しないことが重要です。([W3C][3])
余白は、図の用途に合わせて決めます。等高線だけを見せる図では、線端が切れない程度の余白で十分です。図枠、方位、縮尺、凡例、注記を同じSVGへ含める場合は、それらの配置領域を見込みます。余白が広すぎると地形部分が小さくなり、狭すぎると端部の線や線幅の外側が切れることがあります。
書き出し後は、異なる表示幅や高さで開き、地形形状が伸び縮みしていないかを確認します。Webページへ組み込む場合は、親要素の幅だけが変わることもあります。表示枠の変化に対して縦横比が維持され、必要な範囲が適切に収まることを確認します。
設定2 線幅と単位を用途に合わせて固定する
2つ目の設定は線幅です。等高線の形状が正しくても、最終表示に対して線幅が細すぎると、画面上では薄くなったり、一部が途切れたように見えたりします。逆に太すぎると、急傾斜部で隣接線が重なり、地形を読み取りにくくなります。線幅は、最終的な表示寸法、印刷縮尺、背景、線間隔、主曲線と計曲線の区別を踏まえて決めます。
SVGではstroke-widthによって線幅を指定します。プレゼンテーション属性として単位のない数値を指定した場合、その値はユーザー座標系の長さとして扱われます。CSSプロパティとして指定する場合は、pxなどの長さ単位も利用できます。百分率の扱いにはビューポートとの関係があるため、互換性と管理のしやすさを重視するなら、用途に合った単位を明示し、出力先で実測することが安全です。SVG 2ではstroke-widthは長さまたは百分率として定義され、初期値は1です。([W3C][2])
座標範囲が数千単位あるSVGで、単位なしのstroke-widthを極端に小さくすると、通常表示ではほとんど見えない場合があります。反対に、座標範囲に対して大きすぎる値を指定すると、等高線が帯のように見えます。数値の大小だけでなく、viewBoxから表示枠への倍率を含めて判断します。
画面表示を主目的とする場合は、代表的な端末と通常倍率で安定して見える太さを基準にします。高画素密度の画面でも、CSSピクセル単位の見え方やブラウザーの描画結果は同一とは限りません。主要な表示環境で確認し、特定の画面だけに合わせすぎないようにします。
印刷を主目的とする場合は、最終的な紙面上の線幅で判断します。SVGを文書作成ソフトへ挿入し、PDFへ変換してから印刷する運用では、途中の変換で線幅や透明度の扱いが変わる可能性があります。編集画面だけでなく、最終PDFや実寸印刷でも確認します。
等高線の階層を示す場合は、計曲線を太く、主曲線を細くするなど、線幅差を設けます。ただし、差を大きくしすぎると、太線付近の細かな地形が隠れます。通常表示で区別でき、密集部でも読み取れる範囲に調整します。補助曲線を使う場合は、線幅だけでなく破線などの線種も検討しますが、縮小時に破線の間隔がつぶれないか確認します。
線端と接続部の形状も見え方へ影響します。開いた線ではstroke-linecap、折れ点ではstroke-linejoinが関係します。鋭角部でmiterを使うと突起が目立つことがあり、roundやbevelへ変えると穏やかになります。ただし、接続形状の変更は線の見え方を変えるだけで、元の中心線形状を修正するものではありません。等高線の連続性と用途を確認して選びます。([W3C][4])
線幅を決めた後は、100パーセント表示だけでなく、縮小表示と拡大表示の両方を確認します。密集部、緩斜面、尾根、谷、区域端部など、線間隔や曲率が異なる場所を横断して評価します。
設定3 拡大時の線幅変化を制御する
3つ目は、図形の変換に対して線幅をどのように扱うかという設定です。通常のSVGでは、要素やグループに拡大縮小のtransformを適用すると、形状とともに線幅も変化します。これに対し、vector-effectのnon-scaling-strokeを使うと、図形へ拡大縮小変換を適用しても、ストローク幅を同じ見かけの幅に保つ動作を指定できます。SVG 2ではnon-scaling-strokeが定義されており、その他の一部のvector-effect値より実装上の位置付けが安定しています。([W3C][3])
ここで注意したいのは、non-scaling-strokeがあらゆる種類のズームで物理的な線幅を完全固定する機能ではないことです。SVG要素やグループへ適用する幾何変換に対し、線幅を拡大しないための指定として考えます。ブラウザー全体のページ拡大、OSの表示倍率、印刷変換などでは見え方が変わるため、実利用環境での確認が必要です。
図面全体を拡大し、紙面上でも線を比例して太くしたい場合は、通常のスケーリングが自然です。一方、Web上の操作画面で、地形を拡大しても等高線の見かけの太さをほぼ一定にしたい場合は、non-scaling-strokeが役立つことがあります。どちらを選ぶかは、拡大の意味によって決めます。
線幅を一定に保つと、詳細表示では線間隔が広がる一方で線の見かけの太さは変わりません。そのため、線が相対的に細く感じられることがあります。逆に広域へ縮小すると、線幅が一定のまま密集するため、急傾斜部が黒くつぶれやすくなります。想定倍率の範囲を決め、広域表示と詳細表示の両方で確認します。
広域から詳細まで一つのSVGで対応する場合、倍率に応じて線幅や表示対象を切り替える設計も検討できます。たとえば、広域では計曲線を中心に表示し、詳細では主曲線も表示する方法です。静的なSVGだけで完結させる場合は、用途別に複数の出力を用意した方が管理しやすいこともあります。
複数の変換を重ねないことも重要です。書き出し前の縮尺変更、SVG内部のtransform、配置先での拡大、CSSのtransformが重なると、線幅の根拠を追いにくくなります。可能であれば、SVG内部は一つの基準座標へ統合し、表示サイズはviewBoxと外側の寸法で調整します。変換を残す場合は、どの階層へnon-scaling-strokeを指定したかを確認します。
主曲線、計曲線、補助曲線はクラスや属性を分けておくと、用途別の調整が容易です。全ての線を同じ幅へ固定すると、標高階層が読みにくくなります。線種ごとに線幅、色、破線を設定し、変換後も差が保たれているか確認します。
曲線を鋭く見せようとしてshape-renderingなどの描画ヒントを使う場合も、過信は禁物です。描画ヒントは表示結果を必ず同一にする保証ではなく、曲線ではアンチエイリアスを抑えることで階段状に見える場合があります。等高線では、適切な線幅、座標精度、倍率設計を優先し、曲線の自然さを残す方が読みやすいことが多いです。
設定4 頂点数と座標精度を調整する
4つ目は、等高線を構成する頂点数と座標精度です。点群、数値標高モデル、三角網などから生成した等高線には、多数の頂点が含まれることがあります。頂点が多いほど細かな形状を表現できますが、必要以上に多いとSVGの容量が増え、表示や編集が重くなります。元データのノイズや補間の揺れまで残っている場合は、拡大時に線が細かく波打って見えることもあります。
一方、頂点削減を強くしすぎると、尾根や谷の形状が丸められ、曲線が角ばります。狭い地形変化が消えたり、隣接する等高線との間隔が不自然になったりする可能性もあります。頂点削減の許容値は、元データの水平精度、等高線間隔、最終縮尺、利用目的を踏まえて決めます。
重要なのは、ファイル容量だけを目標にしないことです。たとえば、説明資料では画面上で判別できない微小な揺れを削減しても影響が小さい場合があります。しかし、測量成果の確認や出来形の検討など、形状の忠実性が求められる用途では、同じ削減量でも許容できないことがあります。元成果を保存し、表示用の複製に対して処理します。
座標の小数桁数にも一律の正解はありません。多く残せば形状を保持しやすい一方で、ファイルが大きくなります。少なくしすぎると、複数の頂点が同じ座標へ丸められたり、曲線が折れ線状になったりします。SVG仕様では数値の最低限の精度要件と、座標変換で高い精度を使うことの推奨が示されていますが、出力側で何桁残せば十分かはデータ範囲と必要精度によって変わります。([W3C][2])
大きな座標値のまま小数桁を削るより、表示用に原点を移し、必要な地上分解能を保てる桁数へ調整する方が判断しやすくなります。たとえば、SVG内の1単位が何メートル、何センチメートル、あるいは何ピクセル相当になるかを決め、その単位で必要な誤差範囲を超えないようにします。具体的な桁数は、対象範囲と用途に応じて試験します。
平滑化を行う場合は、頂点削減とは別の処理として考えます。軽い平滑化は見た目を整えることがありますが、線形状そのものを変えます。測量成果や設計判断に使う場合は、表示用に平滑化したSVGと原成果を明確に分けます。見た目を優先したSVGを座標確認用データとして再利用しない運用が重要です。
閉じた等高線では、始点と終点が正しく接続しているか確認します。座標丸めや最適化によって隙間が生じると、塗り分けやクリッピングに使った際に意図しない結果が出ることがあります。短すぎる線分、重複線、自己交差、ほぼ同じ位置にある二重線も、書き出し前に整理します。
実務では、複数の削減条件と小数精度で試し書き出しを行い、急傾斜部、緩斜面、複雑な谷部、閉曲線で比較します。容量、描画速度、通常表示の読みやすさ、元形状との差を確認し、用途に必要な精度を残します。
設定5 透明効果やフィルタを避けて純粋なパスで出力する
5つ目は、等高線をできるだけ単純なパス構造で出力し、不要な透明効果やフィルタを避けることです。SVGには透明度、マスク、クリッピング、ぼかし、影、パターンなど多様な表現機能があります。これらの機能自体が不正確というわけではありませんが、等高線の輪郭を明確に伝える用途では、構造を複雑にし、表示差の原因を特定しにくくすることがあります。
ぼかしフィルタや影を線へ適用すると、輪郭の周囲に意図的な濃淡が加わります。近接する等高線では効果が重なり、二重線や太い帯のように見えることがあります。拡大時の線ぼけを避ける目的では、等高線本体にぼかしや影を付けず、線色と線幅で視認性を調整する方が管理しやすいです。
半透明の線は背景色や重なり順によって見え方が変わります。白背景では読みやすくても、航空画像や色付き地形面の上では弱くなることがあります。線を薄く見せたい場合は、透明度だけでなく、背景とのコントラストを考えて線色を選びます。グループ全体へopacityが設定されていると、個々の線が不透明でも全体が薄くなるため、上位要素の属性も確認します。
SVG書き出し機能によっては、対応できない効果や複雑なオブジェクトを画像へ変換することがあります。SVGのimage要素はPNGやJPEGなどのラスター画像を配置できるため、等高線がパスとして残っているかを確認します。拡大時に輪郭が画素状に崩れる場合は、等高線が画像化されていないかを調べます。背景地図だけを画像にし、等高線をパスとして重ねる構成であれば、背景の解像度には限界があっても、等高線の形状はベクターとして保持できます。([W3C][5])
クリッピングやマスクは、それだけで必ず線をぼかすものではありません。ただし、複数のマスク、フィルタ、透明グループ、変換が入れ子になると、表示差や欠けが生じたときに原因を追いにくくなります。単純な範囲切り出しで済む場合は、書き出し前に線を対象範囲で分割し、不要部分を除去する方法も検討します。元データを損なわないよう、処理は複製へ行います。
等高線をパス中心の単純な構造へ整理すると、後から線色や線幅を変更しやすくなります。標高区分ごとにクラスやidを分けておけば、計曲線だけを強調する、施工範囲内だけ色を変える、背景に応じてスタイルを切り替えるといった調整も容易です。
ただし、全てを一つの巨大な複合パスへまとめればよいとは限りません。ファイルが軽くなる場合がある一方、標高属性との対応や個別編集が難しくなります。配布用の軽量版と編集用の構造保持版を分けるなど、目的に合わせて整理します。
書き出し前に等高線データを整理する
SVGの設定を整えても、元の等高線データに問題があれば、鮮明で信頼できる図にはなりません。書き出し前には、標高属性、線の連続性、重複、不要線、対象範囲、座標系、単位を確認します。複数のデータを結合した場合は、同じ標高の線が重なっていないか、境界部で線がずれていないかを重点的に見ます。
標高属性は、主曲線、計曲線、補助曲線を分ける基礎です。一定の標高間隔ごとに太線を割り当てる場合、属性値の入力ミス、単位の混在、文字列と数値の違いによって分類が崩れることがあります。小数を含む標高値では、丸め条件や余りの判定が想定どおりか確認します。
対象範囲外の等高線を残したまま書き出すと、外接範囲が広がり、必要な区域が小さく表示されることがあります。離れた場所に短い線が一つ残っているだけでも、viewBoxの算出範囲が大きくなる可能性があります。対象を選択した後に外接範囲を確認し、意図しない図形を除きます。
重複線は、部分的に濃く見えたり、拡大時に二重線として見えたりする原因になります。異なる時点や異なる生成条件の等高線を重ねている場合は、比較用途か、単一成果として見せる用途かを明確にします。単一成果として配布する場合は、採用するデータを決め、不要な重複を除きます。
短い孤立線を機械的に全て削除するのは避けます。小さな閉曲線や短線が実際の地形を示している場合もあります。長さだけで削除せず、標高データ、周辺の等高線、生成条件を確認して判断します。
等高線と注記を同時に書き出す場合は、文字の扱いも決めます。文字要素として保持すると検索や編集ができますが、表示環境に同じフォントがない場合は代替フォントによって幅や位置が変わることがあります。文字をパスへ変換すると見た目を固定しやすくなりますが、検索性や編集性が失われ、容量が増える場合があります。配布先、編集予定、アクセシビリティを踏まえて選びます。
SVGへ標高属性や座標系情報をメタデータとして付加することはできますが、一般的なSVG閲覧ソフトがGISの座標参照系として解釈するとは限りません。SVGを地理空間データの完全な代替とせず、元の等高線データ、座標参照系、標高基準、生成条件を別に保持します。SVGは表示・共有用の派生成果として位置付けるのが安全です。
書き出し後に確認したい表示品質とデータ品質
SVGを書き出した後は、作成した環境だけで確認を終えず、実際に利用する表示環境でも検査します。編集ソフトでは鮮明でも、Webページ、文書作成ソフト、PDF変換、印刷で見え方が変わることがあります。通常倍率、縮小、拡大、最終出力の各段階を比較します。
最初に確認するのは、等高線がパスとして保持されているかです。拡大時に四角い画素が目立つ場合は、画像化されている可能性があります。要素の種類を確認できる編集ソフトやテキスト表示で、path、polylineなどの図形要素として保存されているかを見ます。背景画像と等高線を分けて確認すると、どちらがぼけているか判断しやすくなります。
パスであっても、線幅が非常に細い場合は倍率によって濃淡が変わります。これは必ずしもデータ破損ではなく、画素への描画結果です。実利用の表示寸法で安定する線幅へ調整し、線の中心位置を無理に整数座標へ合わせれば常に鮮明になると考えないようにします。斜線や曲線では、座標を整数化すると形状が変わる可能性があります。
次に、計曲線と主曲線の関係を確認します。太線が細線を隠していないか、密集部が黒くつぶれていないか、緩斜面で細線が弱すぎないかを見ます。区域全体から地形条件の異なる複数箇所を選び、同じ設定で問題がないか比較します。
曲線の角ばりや微小な揺れも確認します。角ばりが目立つ場合は、座標精度を落としすぎたか、頂点削減が強すぎる可能性があります。細かな波打ちが多い場合は、元の標高データ、補間条件、等高線生成条件、過剰な頂点が影響している可能性があります。平滑化だけで隠す前に、元データを確認します。
閉曲線、線端、区域境界では、隙間、重複、意図しない接続がないかを見ます。塗り分けやクリッピングに使う場合は、閉じている必要がある線が正しく閉じているか確認します。見た目だけでは気づきにくいため、トポロジー検査や選択機能を利用します。
表示速度も品質の一部です。広範囲の等高線を一つのSVGへまとめると、パス数と頂点数が増え、開くまでに時間がかかったり、拡大縮小が重くなったりします。必要に応じて区域を分割し、見せる範囲だけを出力します。Web用途では、表示範囲や倍率に応じてデータを切り替える構成も検討します。
ファイル最適化を行う場合は、最適化前のSVGを保存します。不要な属性、空要素、冗長な小数を整理すると容量を減らせますが、最適化ツールの設定によっては座標精度、id、クラス、変換構造が変更されます。処理後に線形状、スタイル、属性との対応を再確認します。
最後に、元データとの位置関係を比較します。代表点、区域端部、急な曲率変化、他図形との交差位置などで、SVGの等高線が元データと一致しているかを確認します。見た目が滑らかでも、座標変換や縦横比の設定が誤っていれば、実務資料としては不適切です。
用途別にSVGの設定を調整する
SVGの適切な設定は用途によって変わります。Webページで地形を説明する場合は、表示枠の変化へ対応できるviewBox、縦横比の維持、通常倍率で安定する線幅が重要です。拡大操作をSVG内部のtransformで実装する場合は、non-scaling-strokeの採用を検討します。ただし、縮小時に密集部がつぶれないかを必ず確認します。
広域表示と詳細表示を一つのSVGで兼用すると、どちらかで読みづらくなることがあります。広域では計曲線だけを表示し、詳細では主曲線を追加するなど、表示レベルを分ける方法があります。静的資料では、広域版と詳細版を別ファイルにした方が確実です。
報告書や提案資料へ配置する場合は、最終的な紙面寸法を基準に線幅を決めます。配置後に縮小される場合は、細線が消えないか確認します。等高線を背景として使う場合は、透明度だけに頼らず、線色、線幅、計画線とのコントラスト、レイヤー順序を調整します。
施工計画や現場説明に使う場合は、等高線の正確さに加え、施工範囲、基準点、進入路、構造物との関係を読み取れることが重要です。計曲線を適度に強調し、必要な標高注記を配置します。急斜面では注記を増やしすぎると地形が読みにくくなるため、代表位置へ絞ります。
大型掲示や拡大印刷では、ベクターの利点を生かせますが、小型資料向けの線幅や文字サイズをそのまま拡大すると過剰に見える場合があります。最終寸法に合わせて線幅と注記サイズを再設定し、実寸または縮小校正で確認します。
編集可能なデータとして渡す場合は、線種や標高区分を識別できる構造を保ちます。全てを一つの複合パスへまとめると、個別線の選択や属性との照合が難しくなります。配布用の軽量版と、編集用の構造保持版を分ける方法が実務的です。
正式な測量成果やGISデータとして利用する場合は、SVGだけで完結させないようにします。SVGは表示と共有に適していますが、座標参照系、標高属性、精度、生成条件の相互運用を保証する地理空間データ形式ではありません。元データと変換記録を保存し、SVGは用途別の派生成果として管理します。
等高線のSVG書き出しで起こりやすい失敗
よくある失敗の一つは、SVGへ書き出したという理由だけで、全てがベクター化されたと思い込むことです。SVGはラスター画像を含められるため、等高線がimage要素などで埋め込まれていれば、拡大時に画素が目立ちます。拡張子ではなく、等高線の実体がパスか画像かを確認します。([W3C][5])
次に多いのは、線幅を極端に細くすることです。細く見せれば精密に感じられるとは限りません。表示倍率や画素への配置によって薄くなり、部分的に途切れたように見える場合があります。最終表示で安定して認識できる太さを選びます。
viewBoxの余白を減らすことだけを線ぼけ対策と考えるのも不適切です。viewBoxは表示変換を定義しますが、パスの形状精度そのものを高める属性ではありません。必要範囲、表示寸法、線幅、縦横比をまとめて調整します。
preserveAspectRatioを確認せず、縦横比の異なる表示枠へ押し込むと、設定によっては地形が変形して見えます。等高線では形状の変形が地形解釈へ影響するため、縦横比を保つ設定を基本にします。
座標値を過度に丸めることも問題です。容量を減らすために小数桁を削りすぎると、曲線が角ばり、近接線の間隔が変わります。不要な頂点や重複線を先に整理し、その後で必要精度を保てる桁数へ調整します。
反対に、元データの全頂点をそのまま出力し、極端に大きなSVGを作る失敗もあります。点群や標高モデル由来の微小な揺れまで含まれていると、表示が重くなり、見た目も不安定になります。用途に応じた頂点削減を行い、元成果と表示用データを分けます。
non-scaling-strokeを指定すれば、全ての拡大操作で線幅が完全に同じになると思い込むことにも注意が必要です。この指定は主に図形へ適用される変換に対してストロークを拡大しないためのものです。ページ拡大、印刷、外部ソフトへの配置では別の変換が関わるため、最終環境で確認します。([W3C][3])
複数の拡大縮小変換を残すと、線幅の根拠が分かりにくくなります。書き出し前の縮尺変更、SVG内部のtransform、配置先の拡大、CSS変換が重なる場合は、各段階を整理します。可能な範囲で基準座標へ統合し、表示寸法をviewBoxと外側の幅・高さで管理します。
透明度、影、ぼかしで線を見やすくしようとすると、背景や変換先によって結果が変わりやすくなります。等高線本体は単純な線色と線幅を基本とし、計画線や注記との重なりは色、線種、レイヤー順序で整理します。
最後に、見た目だけを確認し、標高属性や位置関係を確認しない失敗があります。線が滑らかでも、計曲線の分類が誤っていたり、座標変換で形状が変わっていたりすれば、実務資料として適切ではありません。表示品質、形状の忠実性、属性の整合性を分けて検査します。
まとめ
等高線をSVGで鮮明に書き出すには、保存形式を変更するだけでなく、SVG内部の構造と表示条件を整える必要があります。座標範囲とviewBoxを適正化し、用途に合った線幅と単位を選び、図形変換に対する線幅の挙動を決め、頂点数と座標精度を調整し、不要な透明効果やフィルタを避けてパス中心の構造へ整理することが基本です。
特に、等高線が画像として埋め込まれていないか、線幅が表示寸法に対して細すぎないか、preserveAspectRatioによって地形が変形していないか、座標を丸めすぎていないか、複数の変換が重なっていないかを確認します。SVGはベクターとラスターを混在でき、viewBoxはユーザー座標系を表示領域へ対応付ける変換を定義します。仕様上の役割を理解し、各設定へ過度な効果を期待しないことが重要です。([W3C][1])
書き出し前には、重複線、不要線、標高属性、対象範囲、閉曲線、座標系を確認します。書き出し後には、パスとして保持されているか、通常倍率で読みやすいか、最終出力で線幅が変わっていないか、元データとの位置関係が保たれているかを確認します。
SVGは、等高線を報告書、Web表示、施工説明、拡大掲示などへ展開しやすい形式です。一方、一般的なSVG表示環境が測量座標系や標高属性を地理空間データとして解釈するとは限りません。元の等高線データ、座標参照系、標高基準、変換条件を保存し、SVGは用途に合わせた表示用成果として管理する運用が安全です。
現場で等高線や施工図を活用する場合は、図面に加えて、撮影地点、撮影方向、作業時点、現地状況を対応付けておくと、後から地形と現場の関係を確認しやすくなります。LRTK Phoneを利用する場合も、利用可能な位置情報付き写真や記録管理の機能、座標系、精度条件、データ出力方法を確認したうえで、SVGの等高線や計画図と照合します。図面の表示品質と現場記録の整合性を別々に検証し、元データを保持しながら説明、共有、確認へ活用することが重要です。