<div id="myChartLegend"></div>
</div>
<pre class="language-markup">
<code class="language-markup">
	&lt;div id=&quot;chart-container&quot;&gt;
		&lt;canvas id=&quot;htmlLegendsChart&quot;&gt;&lt;/canvas&gt;
	&lt;/div&gt;
	&lt;div id=&quot;myChartLegend&quot;&gt;&lt;/div&gt;
</code>
</pre>
<pre class="language-markup">
<code class="language-javascript">

var htmlLegendsChart = document.getElementById('htmlLegendsChart').getContext('2d');

// Chart with HTML Legends

var gradientStroke = htmlLegendsChart.crea