使用echarts插件做圖表常見的幾個問題（五）——圖形的兩種渲染方式

場景：echarts中圖形有兩種渲染方式，canvas渲染和svg渲染，分別運用在什么樣的場景下

措施：Canvas 更適合繪制圖形元素數量非常大（這一般是由數據量大導致）的圖表（如熱力圖、地理坐標系或平行坐標系上的大規模線圖或散點圖等），也利於實現某些視覺特效；在不少場景中，SVG 具有重要的優勢：它的內存占用更低（這對移動端尤其重要）、渲染性能略高、並且用戶使用瀏覽器內置的縮放功能時不會模糊。

在初始化圖表實例時，傳入參數選擇渲染器類型，代碼如下

// 使用 Canvas 渲染器（默認）
var chart = echarts.init(containerDom, null, {renderer: 'canvas'});
// 等價於：
var chart = echarts.init(containerDom);
// 使用 SVG 渲染器
var chart = echarts.init(containerDom, null, {renderer: 'svg'});