SVG Support

[v3ss0n]

Feature request for SVG Support.

[jespertheend]

This is what I'm using

svtToPng.html

<div id="fileBox"></div>
<input placeholder="scale" id="sizeInput" value="128" />
<div id="output" />
<script>
	var el = null;
	window.onload = () => {
		createFileElem();
		document.getElementById("sizeInput").onchange = renderStuff;
	};

	function createFileElem(){
		el = document.createElement("input");
		el.type = "file";
		el.onchange = renderStuff;
		let fileBox = document.getElementById("fileBox");
		fileBox.innerHTML = "";
		fileBox.appendChild(el);
	}

	function renderStuff(){
		if(el.files.length > 0){
			let reader = new FileReader();
			reader.onload = (e) => {
				let size = document.getElementById("sizeInput").value;
				if(size == "") size = 128;
				makePng(e.target.result, +size);
			}
			reader.readAsText(el.files[0]);
		}
	}

	function makePng(svgData,size){
		var img = new Image();
		var svg = new Blob([svgData], {type: 'image/svg+xml;charset=utf-8'});
		var DOMURL = window.URL || window.webkitURL || window;
		var url = DOMURL.createObjectURL(svg);
		img.onload = function(){
			var canvas = document.createElement('canvas');
			canvas.width = size;
			canvas.height = size;
			var ctx = canvas.getContext('2d');
			ctx.drawImage(img,0,0,size,size);
			DOMURL.revokeObjectURL(url);
			document.getElementById("output").innerHTML = '<img src="'+canvas.toDataURL()+'" style="background: black;" />';
		}

		img.src = url;
	}
</script>

drag the file to your browser, and it renders it exactly as a browser would do :)
You can drag the rendered image to your desktop or save it or something.

[v3ss0n]

What??

[jespertheend]

You can use it to convert svg to png, it's not as good as having it convert while building the application but it did the job for me.

[artuska]

@jespertheend Wtf, dude :) The feature request is about to support SVG for app icons and splash screens, not how to convert SVG to PNG.

[jespertheend]

I understand that, and I wanted something like that as well, but I'm using this in the meantime as a workaround.