svgに関するkiyo_hikoのブックマーク (17)
-
kiyo_hiko 2023/05/18
-
SVG 画像/アイコンを Excel に挿入 via .NET
どのデバイスでも画像を引き伸ばしたり圧縮したりしたくないですか? ズームインしたときに画像がぼやけたくないですか? 高解像度で画像が歪んだくないですか? おそらく SVG が良い選択です。SVG 画像はどのズーム レベルでも見栄えがよく、解像度に依存しません。SVG 画像の忠実度が高いため、Excel ユーザーの間で非常に人気があります。 Excel を使用すると、次の問題が発生する場合があります。 対象の Excel ファイルを手動で直接操作することはできず、処理するにはプログラムが必要です。多数の SVG 画像を同じ Excel ファイルに挿入します。SVG 画像を多数の異なる Excel ファイルに挿入します。これらの問題を解決するには、次の使用をお勧めします。 Aspose.Cells ライブラリ。Excel ファイルを処理するための一般的なインターフェイスが多数含まれており、非常
-
シンプル・爆速・超便利な無料SVGエディター「Boxy SVG」って知ってる？
Microsoft Wordで「Webページとして保存」したHTMLを使ったことがありますか？ おっと、これはひどい。 考え方は素晴らしかったですが、実際に初めて使ったとき思わずコーヒーを口から吹き出してしまった人もいるかもしれません。常に複雑で長ったらしく、Web向けとしてはとても満足できる品質ではありませんでした。大して珍しいことでもないですが…。 正直なところ、MS Wordのユーザーは、おそらく何がベストなのかを特に意識していないでしょう。むしろ、考えているのは次のようなことではないでしょうか。 ページのロード回数は？ Web画像のフォーマットは？ セマンティックWebやSEOへの対応は？ スクリーンサイズ調整は（柔軟なデザインか）？ 対応フォントは？ 後から考え直して修正する無駄が多い混乱したHTMLは驚くべきこと、というのは明白ですね。 SVGは新たな「Webページとして保存」
-
マークアップ・エンジニアのためのSVG入門 | 第1回 SVGコードの基本
マークアップ・エンジニアのためのSVG入門 第1回 SVGコードの基本 この記事ではまずSVGのコードとしての基本と、さまざまな実装方法を概観してみましょう。それぞれの特徴を捉えられると、実装方法の選択が適切にできます。 はじめに SVGは、Android2.0系やIE8では対応していませんので、今の段階で気軽には使いづらい技術です。しかし、iOS Safari向けのWebページなど、限られた環境に向けては効果を発揮します。今回はマークアップエンジニアが知っておくべきSVGの仕様や使い方を見直してみましょう。 画像でありテキストである 「SVG＝スケーラブルなベクター形式」は、SVGの大きな特徴です。このことは多くの人が認識しているでしょう。 ラスタ形式は特に拡大に弱く、拡大するとドットが目立つ。一方、ベクター形式は拡大しても画像の劣化はない。 SVGにはソースコードが存在し、これにより画
-
-
作図系ツール・ライブラリまとめ
diag.md シーケンス図とかフローチャートをしごとで描画することになった場合、 テキストから生成できたら楽なので、それ系のツールまとめ GraphViz http://www.graphviz.org/ C製 Doxygen, Moinmoinなどと連携可能 ブロック図、クラス図、ネットワーク図など PNG, SVGなど 出力可能形式一覧 JavaScript（Emscripten）版もある。リアルタイムプレビュー出来て便利 https://github.com/mdaines/viz.js PlantUML Java製 シーケンス図, ユースケース図, クラス図, アクティビティ図, コンポーネント図, ステート図, デプロイ図, オブジェクト図などめっちゃたくさん作れる PNG, SVG, LaTeX, ASCII出力 なんとワイヤーフレームも作れる。アイコンとかも入れられる。 オ
-
-
【node.js+D3.js】サーバーサイドD3
残念なことにwindowsではjake(JavaScript build tool)がうまくインストールされないらしくビルドの途中でエラーを吐いてとまります。 サンプルコード 内部ではjsdomを使ってDOM操作を行っています。基本的にはフロントエンドでD3を使用するのと変わりません。 var d3 = require("d3"); var svg = d3.select("body") .append("svg") .attr({ "xmlns": "http://www.w3.org/2000/svg", "width": 750, "height": 750 }); svg.append('circle') .attr({ cx:100, cy:100, r:80, fill:'red' }) console.log(d3.select('body').node().innerHTM
-
10分でわかるSVG 基礎編
知って得する、Webブラウザ上で利用できるグラフィック関連技術。HTMLのような感覚で図形が描画できる「SVG」をハックしよう SVGドキュメントの書き方 本連載では、Webブラウザ上で利用できるグラフィック技術を分かりやすく紹介しています。第2回となる今回のテーマはSVGです。 ご存じの方も多いと思いますが、SVGはXMLをベースにしたベクトルグラフィックスの記述言語です。PNGのような画像フォーマットの1つでもありますが、実際にはXMLを記述したテキストファイルであり、HTMLと同様にJavaScript（DOM API）による制御も行えます。HTMLがタグによって文書の構造を記述するのと同様に、SVGはタグで図形を記述します。 ■ XMLでベクトルグラフィックスを記述するSVG 実はSVGの規格自体はかなり以前から存在したのですが、長らくInternet Explorer（以降IE）
-
【D3.js】D3.jsを使ってSVGで地図を描く
//プロジェクション設定 var projection = d3 .geoMercator() //投影法の指定 .scale(16000) //スケール（ズーム）の指定 .rotate([-0.25, 0.25, 0]) //地図を回転する [x,y,z] .center([139.0032936, 36.3219088]); //中心の座標を指定 //パスジェネレーター生成 var path = d3.geoPath().projection(projection); //地図用のステージ(SVGタグ)を作成 var map = d3.select("body") .append("svg") .attr("width", 960) .attr("height", 500); //地理データ読み込み d3.json("gunma.geojson", drawMaps); //地図を描画
-
SVGを制作できるアプリ,お絵描きソフトを徹底的に調べました！ 114個 - 聴く耳を持たない(片方しか)
私はTwitterでよくSVG関連情報をチェックしているのですが、 SVGってどう作ったらいいの？ みたいな投稿をしばしば見かけます。 SVGは地味な存在ですが近年は徐々に注目を浴び、関連ツールも増えてきたのでそうした人向けにSVG制作ツールって結構たくさんあるよ！と、まとめてみた次第です。 でも114個って多過ぎ！ ……って思うかもしれない、いや正直オレもそう思う。 なので最後に114個の中から管理人のお薦めツール10選っていうのもまとめておいたので、さっくり読みたい人はそれだけチェックすれば良いかと。 そもそもSVGとは、なに？ そもそもSVGってなに？という人もいるでしょう、それについては以前記事にまとめました。 SVGとはなにか？とSVGの学習に役立つサイトや書籍の紹介 SVGの説明と、SVGの学習に役立つサイトや参考になる書籍の紹介をしています。 今回とりあげるSVG関連ツールと
-
SVGに対する誤解を紐解く
憎きieがようやっと世代交代するにあたり，今年こそSVG元年となるべく，(個人的に)頑張らにゃいかん，そんな気がするんですが，そうは行っても世間的にはsvgはまだまだマイナーな存在であってwebを眺めると結構な思い込みとか偏見とかが見受けられます．まぁ別に構いやしないんですが，SVGのポテンシャルを引き出すにはより良いSVGへの理解は必須ですから，ひとつ私見ではありますがよくあるSVGに対する誤解に意見してみようかと． つーかHIT数多すぎてびっくりしているんよ ちょこちょこ追加していくよ Thanx @rikuo . 注意・2014/01/16 この記事はある程度SVGについて調べた上で読むことをおすすめします．そうすることでSVGを”理解した後に生まれてくる”数々のモヤモヤが解消することでしょう．（筆者もかつてそうでした） 逆にSVGに不慣れな人が読んだ場合，却って理解を妨げる危険があ
-
-
D3.js
D3The JavaScript library for bespoke data visualization Create custom dynamic visualizations with unparalleled flexibility
-
米Adobe、オープンソースのSVGコンテンツ用JavaScriptライブラリ「Snap.svg」を公開 | OSDN Magazine
米Adobe Systemsは10月23日、SVGグラフィックスを操作するためのJavaScriptライブラリ「Snap.svg」をオープンソースソフトウェアとして公開した。プロジェクトのWebサイトより入手できる。 Snap.svgは、ベクター画像フォーマットであるSVG（Scalable Vector Graphics）で作成されたコンテンツを操作するためのライブラリ。ベクター画像をWebブラウザ上で作成するためのJavaScriptライブラリ「Raphaël」を作成したDmitry Baranovskiy氏が開発しており、jQueryによるDOM操作のように簡単にSVGデータを操作できることを目的としている。 Snap.svgではSVGコンテンツの生成および操作が可能で、既存のSVGコンテンツの操作も可能。マスキング、クリッピング、パターン、フルグラデーション、グループ化といったSV
-
-
-
1
Amazon.co.jp: Webで使える!SVGファ-ストガイド: 相澤裕介: 本
File:Linux Distribution Timeline.svg - Wikimedia Commons
公式Twitter
- @HatenaBookmark
リリース、障害情報などのサービスのお知らせ
- @hatebu
最新の人気エントリーの配信
キーボードショートカット一覧
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
