mirror of
https://github.com/chartjs/Chart.js.git
synced 2024-10-06 12:19:08 +02:00
55128f74c1
In order to be compatible with any CSP, we need to prevent the automatic creation of the DOM 'style' element and offer our CSS as a separate file that can be manually loaded (`Chart.js` or `Chart.min.js`). Users can now opt-out the style injection using `Chart.platform.disableCSSInjection = true` (note that the style sheet is now injected on the first chart creation). To prevent duplicating and maintaining the same CSS code at different places, move all these rules in `platform.dom.css` and write a minimal rollup plugin to inject that style as string in `platform.dom.js`. Additionally, this plugin extract the imported style in `./dist/Chart.js` and `./dist/Chart.min.js`.
28 lines
1.0 KiB
HTML
28 lines
1.0 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en-US">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<meta http-equiv="Content-Security-Policy" content="default-src 'self'">
|
|
<title>Scriptable > Bubble | Chart.js sample</title>
|
|
<link rel="stylesheet" type="text/css" href="../../dist/Chart.min.css">
|
|
<link rel="stylesheet" type="text/css" href="./content-security-policy.css">
|
|
<script src="../../dist/Chart.min.js"></script>
|
|
<script src="../utils.js"></script>
|
|
<script src="content-security-policy.js"></script>
|
|
</head>
|
|
<body>
|
|
<div class="content">
|
|
<div class="note">
|
|
In order to support a strict content security policy (<code>default-src 'self'</code>),
|
|
this page manually loads <code>Chart.min.css</code> and turns off the automatic style
|
|
injection by setting <code>Chart.platform.disableCSSInjection = true;</code>.
|
|
</div>
|
|
<div class="wrapper">
|
|
<canvas id="chart-0"></canvas>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|