I recently added elevation profiles to the weblogue posts on my cross-continental bicycle ride. They are rudimentary still but quite serviceable. There is, however, a notable issue regarding screen resolution. Rather than providing a fixed width and height to the SVG files, I take advantage of the scalable bit in Scalable Vector Graphic by setting the viewBox attribute on the svg element, except these profiles are line/area graphs with axes for distance (independent variable) and elevation (dependent variable).
Possible solutions: use d3.js to dynamically generate a graph sized to fit the screen it’s displaying on; don’t display the graph on small screens unless the viewer explicitly selects to view the image by clicking a link; other ideas which violate the purpose of using scalable vector graphics.