<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<div name="messageBodySection">
<div dir="auto">I think it’s maybe time to update that library… JqPlot is old.<br />
<br />
Plotly or ChartJs or Anychart ?</div>
</div>
<div name="messageSignatureSection"><br />
<div class="matchFont"><span style="caret-color: rgb(0, 0, 0); color: rgb(0, 0, 0);">Best Regards,</span><br style="caret-color: rgb(0, 0, 0); color: rgb(0, 0, 0);" />
<b style="caret-color: rgb(0, 0, 0); color: rgb(0, 0, 0);">Sukhdev Mohan</b><span style="caret-color: rgb(0, 0, 0); color: rgb(0, 0, 0);"> | </span><b style="caret-color: rgb(0, 0, 0);"><font color="#996633">Software Developer</font></b></div>
</div>
<div name="messageReplySection">On 23 Jun 2021, 12:23 +0200, Angelo Paglialonga <info@angelopaglialonga.com>, wrote:<br />
<blockquote type="cite" style="border-left-color: grey; border-left-width: thin; border-left-style: solid; margin: 5px 5px;padding-left: 10px;">Ok I will take a look at it <a href="https://code.vtiger.com/vtiger/vtigercrm/blob/master/modules/Vtiger/models/Widget.php#L126" class="">https://code.vtiger.com/vtiger/vtigercrm/blob/master/modules/Vtiger/models/Widget.php#L126</a>,
<div class=""> it seems interesting ! <br class="" />
<div class=""><br class="" /></div>
<div class="">I could provide a change request with donut and gauge widget types, let’s wait if Uma likes it. </div>
<div class=""><br class="" /></div>
<div class=""> There are lots of other options, you can modify just take a look at this snippet from file <span style="color: rgb(8, 8, 8); font-family: "JetBrains Mono", monospace; background-color: rgb(255, 255, 255);" class="">vtJqPlotInterface.js</span>.
<div class=""><br class="" /></div>
<div class=""><br class="" />
<div class=""><br class="" /></div>
<div class="">
<pre style="background-color:#ffffff;color:#080808;font-family:'JetBrains Mono',monospace;font-size:9,8pt;" class=""><span style="color:#0033b3;" class="">this</span>.renderHorizontalbar = <span style="color:#0033b3;" class="">function</span>() {<br class="" />    <span style="color:#0033b3;" class="">this</span>.element.jqplot(<span style="color:#0033b3;" class="">this</span>.data[<span style="color:#067d17;" class="">'chartData'</span>], {<br class="" />        title: <span style="color:#0033b3;" class="">this</span>.data[<span style="color:#067d17;" class="">'title'</span>],<br class="" />        animate: !$.jqplot.use_excanvas,<br class="" />        seriesDefaults: {<br class="" />            renderer:$.jqplot.BarRenderer,<br class="" />            showDataLabels: <span style="color:#0033b3;" class="">true</span>,<br class="" />            pointLabels: { show: <span style="color:#0033b3;" class="">true</span>, location: <span style="color:#067d17;" class="">'e'</span>, edgeTolerance: -<span style="color:#1750eb;" class="">15 </span>},<br class="" />            shadowAngle: <span style="color:#1750eb;" class="">135</span>,<br class="" />            rendererOptions: {<br class="" />                barDirection: <span style="color:#067d17;" class="">'horizontal'<br class="" /></span><span style="color:#067d17;" class="">            </span>}<br class="" />        },<br class="" />        axes: {<br class="" />            yaxis: {<br class="" />                tickRenderer: jQuery.jqplot.CanvasAxisTickRenderer,<br class="" />                renderer: jQuery.jqplot.CategoryAxisRenderer,<br class="" />                ticks: <span style="color:#0033b3;" class="">this</span>.data[<span style="color:#067d17;" class="">'labels'</span>],<br class="" />                tickOptions: {<br class="" />                    angle: -<span style="color:#1750eb;" class="">45<br class="" /></span><span style="color:#1750eb;" class="">                </span>}<br class="" />            }<br class="" />        },<br class="" />        legend: {<br class="" />            show: <span style="color:#0033b3;" class="">true</span>,<br class="" />            location: <span style="color:#067d17;" class="">'e'</span>,<br class="" />            placement: <span style="color:#0033b3;" class="">this</span>.legendPlacement,<br class="" />            showSwatch : <span style="color:#0033b3;" class="">true</span>,<br class="" />            showLabels : <span style="color:#0033b3;" class="">true</span>,<br class="" />            labels:<span style="color:#0033b3;" class="">this</span>.data[<span style="color:#067d17;" class="">'data_labels'</span>]<br class="" />        }<br class="" />    });<br class="" />}</pre>
<div class=""><br class="" /></div>
<div class=""><br class="" />
<div class=""><br class="" /></div>
<div class=""><br class="" /></div>
<div class=""><br class="" />
<div class="">
<div>_______________<br class="" />
<br class="" />
Angelo Paglialonga<br class="" />
Consulente per soluzioni CRM ad alto ROI.<br class="" />
<br class="" />
Telefono: 3386077866<br class="" />
Skype: angelo.paglialonga<br class="" />
Web: <a href="https://www.angelopaglialonga.com" class="">https://www.angelopaglialonga.com</a></div>
<div><br class="" /></div>
<br class="Apple-interchange-newline" /></div>
<div><br class="" />
<blockquote type="cite" class="">
<div class="">Il giorno 23 giu 2021, alle ore 12:04, Alan Lord <<a href="mailto:alanslists@gmail.com" class="">alanslists@gmail.com</a>> ha scritto:</div>
<br class="Apple-interchange-newline" />
<div class="">
<div class="">You cannot define a default widget size.<br class="" />
<br class="" />
The Vtiger_Widget_Model class is initially instantiated from the Vtiger_Dashboard_Model by calling:<br class="" />
<br class="" />
<blockquote type="cite" class="">Vtiger_Widget_Model::getInstanceFromValues($row);<br class="" /></blockquote>
<br class="" />
This method does not support loading of inherited classnames:<br class="" />
<br class="" />
<a href="https://code.vtiger.com/vtiger/vtigercrm/blob/master/modules/Vtiger/models/Widget.php#L126" class="">https://code.vtiger.com/vtiger/vtigercrm/blob/master/modules/Vtiger/models/Widget.php#L126</a><br class="" />
<br class="" />
Once the widget data is loaded onto the Dashboard, you can then use your own inherited Class as the Widget Model is loaded again, from the MyModule/dashboards/MyModule_CustomWidget_Dashboard class.<br class="" />
<br class="" />
But you cannot change the initial default sizing without changing the core Vtiger_Widget_Model class.<br class="" />
<br class="" />
Try it ;-)<br class="" />
<br class="" />
Al<br class="" />
<br class="" />
PS: If you get bored take a look eCharts: https://echarts.apache.org/examples/en/index.html<br class="" />
<br class="" />
<br class="" />
On 23/06/2021 10:49, Angelo Paglialonga wrote:<br class="" />
<blockquote type="cite" class="">Hi Alan you can bypass such limitations (title position, whatever option you need) , even add more widget types like gauges by including in your custom module a new vtJqPlotInterface, copy and paste from libraries/jquery/VtJqplotInterface.js<br class="" />
and add/modify for every widget type all options you need.<br class="" />
I hope that helps you!<br class="" />
_______________<br class="" />
Angelo Paglialonga<br class="" />
Consulente per soluzioni CRM ad alto ROI.<br class="" />
Telefono: 3386077866<br class="" />
Skype: angelo.paglialonga<br class="" />
Web: https://www.angelopaglialonga.com <https://www.angelopaglialonga.com><br class="" />
<blockquote type="cite" class="">Il giorno 23 giu 2021, alle ore 11:40, Alan Lord <alanslists@gmail.com <mailto:alanslists@gmail.com>> ha scritto:<br class="" />
<br class="" />
On 23/06/2021 10:06, Angelo Paglialonga wrote:<br class="" />
<blockquote type="cite" class="">Could we add new dashboards?<br class="" /></blockquote>
<br class="" />
You can add new widgets but there are some limitations:<br class="" />
<br class="" />
https://code.vtiger.com/vtiger/vtigercrm/issues/1026 <https://code.vtiger.com/vtiger/vtigercrm/issues/1026><br class="" />
<br class="" />
Al<br class="" />
<br class="" />
_______________________________________________<br class="" />
http://www.vtiger.com/<br class="" /></blockquote>
_______________________________________________<br class="" />
http://www.vtiger.com/<br class="" /></blockquote>
_______________________________________________<br class="" />
http://www.vtiger.com/<br class="" /></div>
</div>
</blockquote>
</div>
<br class="" /></div>
</div>
</div>
</div>
</div>
</div>
_______________________________________________<br />
http://www.vtiger.com/<br /></blockquote>
</div>
</body>
</html>