<div class="demo-section"> <h3>Telephone</h3> <?php $qrTelephoneBorder = new \Kendo\Dataviz\UI\QRCodeBorder(); $qrTelephoneBorder->color("#67a814")->width(5); $qrTelephone = new \Kendo\Dataviz\UI\QRCode('qrTelephone'); $qrTelephone->value("tel:+1-888-365-2779")->size(120)->errorCorrection("Q")->color("#67a814")->border($qrTelephoneBorder); echo $qrTelephone->render(); ?> </div> <div class="demo-section"> <h3>Geo Location</h3> <?php $qrGeoLocation = new \Kendo\Dataviz\UI\QRCode('qrGeoLocation'); $qrGeoLocation->value("geo:42.65049,23.37925,100")->errorCorrection("H")->size(120)->color("#166a83"); echo $qrGeoLocation->render(); ?> </div> <style scoped> .demo-section { display: inline-block; margin: 17px; } .k-qrcode { display:inline-block; margin: 10px 0 0; border: none; } </style>
<li> <label for="backgroundColor">Background color:</label> <input id="backgroundColor" data-role="colorpicker" data-bind="value: qrOptions.background" /> </li> <li> <label for="moduleColor">Module color:</label> <input id="moduleColor" data-role="colorpicker" data-bind="value: qrOptions.color" /> </li> </ul> </div> </div> <div class="demo-section"> <?php $qrCode = new \Kendo\Dataviz\UI\QRCode('qrCode'); $qrCode->size(200); echo $qrCode->render(); ?> </div> <script type="text/javascript"> $(document).ready(function () { var qrCode = $("#qrCode").kendoQRCode({ size: 200 }).data("kendoQRCode"); var viewModel = kendo.observable({ qrValue: "Hello World", qrOptions: { errorCorrection: "L", encoding: "ISO_8859_1", background: "#FFFFFF",