×ðÁú¿­Ê±

laravelÏîÄ¿ÖÐÔõôÌí¼ÓÖù״ͼ

laravelÊÇÒ»¸öÆÕ±éʹÓõÄphp webÓ¦ÓóÌÐò¿ª·¢¿ò¼Ü £¬ËüÌṩÁ˸»ºñµÄ¹¤¾ßºÍ¹¦Ð§Ê¹µÃ¿ª·¢Õß¿ÉÒÔ½¨Éè¸ßЧ £¬¿ÉÀ©Õ¹µÄwebÓ¦ÓóÌÐò¡£ÆäÖаüÀ¨Êý¾Ý¿ÉÊÓ»¯¹¤¾ß £¬¿ÉÒÔͨ¹ýlaravelʵÏÖÖù״ͼ¡£

Êý¾Ý¿ÉÊÓ»¯ÊÇÒ»ÖÖºÜÊÇÖ÷ÒªµÄÊÖÒÕ £¬ËüʹµÃÊý¾ÝÔ½·¢Ò×ÓÚÃ÷È·ºÍÆÊÎö¡£Öù״ͼÊÇÊý¾Ý¿ÉÊÓ»¯ÖÐ×î³£¼ûµÄ·½·¨Ö®Ò»¡£LaravelÌṩÁ˶àÖÖÒªÁìÒÔʵÏÖÖù״ͼ¡£ÏÂÃæ¾Í¼òÆÓÏÈÈÝÒ»ÏÂÆäÖÐÁ½ÖÖÒªÁ죺

µÚÒ»ÖÖ·½·¨£ºÊ¹ÓÃLaravel ChartsÀ©Õ¹°ü

Laravel ChartsÊÇÒ»¸ö»ùÓÚChart.js¿â¹¹½¨µÄLaravelÀ©Õ¹°ü¡£Ëü¿ÉÒÔºÜÀû±ãµØÌìÉú²î±ðÀàÐ͵Äͼ±í £¬°üÀ¨Öù״ͼ¡¢ÕÛÏßͼ¡¢±ýͼµÈ¡£ËüÖ§³Ö¸»ºñµÄÉèÖÃÑ¡Ïî £¬ÈçÑÕÉ«¡¢±êÇ©¡¢×ø±êÖáµÈ £¬¿ÉÒÔ¶Ôͼ±í¾ÙÐж¨ÖƺÍÃÀ»¯¡£

ʹÓÃLaravel ChartsºÜÊǼòÆÓ £¬Ö»ÐèÔÚcomposer.jsonÎļþÖÐÌí¼ÓÒÀÀµ£º

¡°consoletvs/charts¡±: ¡°~6.0¡±,

µÇ¼ºó¸´ÖÆ

È»ºóÔÚÖÕ¶ËÖÐÔËÐÐcomposer installÍê³É°üµÄ×°Öá£×°ÖÃÍê³ÉÖ®ºó £¬¿ÉÒÔͨ¹ýÒÔÏ´úÂëÀ´ÌìÉúÖù״ͼ£º

use ConsoleTVs\Charts\Facades\Charts;

$chart = Charts::create('bar', 'highcharts')
             ->title('Monthly Sales')
             ->elementLabel('Total Sales')
             ->labels(['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun'])
             ->values([50, 70, 80, 90, 100, 120]);

return view('sales', ['chart' => $chart]);

µÇ¼ºó¸´ÖÆ

Õâ¶Î´úÂ뽫ÌìÉúÒ»¸öÖù״ͼ £¬ÎÊÌâΪ¡°Monthly Sales¡± £¬ºáÖáΪÔ·Ý £¬×ÝÖáΪÏúÊ۶ͨ¹ýÉÏÊö´úÂë £¬¿ÉÒÔÇáËÉʵÏÖÖù״ͼµÄÌìÉú¡£

µÚ¶þÖÖ·½·¨£ºÊ¹ÓÃJavaScript¿â

³ýÁËʹÓÃLaravel ChartsÀ©Õ¹°ü £¬»¹¿ÉÒÔʹÓÃJavaScript¿âÀ´ÊµÏÖÖù״ͼ¡£ÏÖÔÚ×î³£¼ûµÄJavaScript¿â°üÀ¨Chart.js¡¢Highcharts¡¢EChartsµÈ¡£ÕâЩ¿â¿ÉÒÔͨ¹ýCDN»òÕßÍâµØÒýÈëÀ´Ê¹Óá£

ÒÔChart.jsΪÀý £¬¿ÉÒÔͨ¹ýÈçÏ´úÂëÀ´ÌìÉúÖù״ͼ£º

<canvas></canvas>

µÇ¼ºó¸´ÖÆ

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

var myChart = new Chart(ctx, {
    type: 'bar',
    data: {
        labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun'],
        datasets: [
            {
                label: 'Monthly Sales',
                data: [50, 70, 80, 90, 100, 120],
                backgroundColor: 'rgba(0, 119, 204, 0.5)',
                borderColor: 'rgba(0, 119, 204, 1)',
                borderWidth: 1
            }
        ]
    }
});

µÇ¼ºó¸´ÖÆ

ͨ¹ýÉÏÊö´úÂë £¬¿ÉÒÔÔÚHTMLÒ³ÃæÖÐÌìÉúÒ»¸öIDΪ¡°myChart¡±µÄ»­²¼ £¬È»ºóͨ¹ýJavaScript´úÂëÌìÉúÖù״ͼ²¢äÖȾµ½»­²¼ÉÏ¡£

×ܽ᣺

ÒÔÉÏÊÇÁ½ÖÖʹÓÃLaravelʵÏÖÖù״ͼµÄÒªÁì¡£¿ÉÒÔƾ֤×Ô¼ºµÄÐèÒªÀ´Ñ¡ÔñºÏÊʵÄÒªÁì £¬Êý¾Ý¿ÉÊÓ»¯¿ÉÒÔʹµÃÊý¾ÝÔ½·¢Ö±¹Û £¬ÕÆÎÕÕâÒ»ÊÖÒÕ¹ØÓÚ¿ª·¢¸ßЧ¾«Á·µÄWebÓ¦ÓóÌÐòÖÁ¹ØÖ÷Òª¡£

ÒÔÉϾÍÊÇlaravelÏîÄ¿ÖÐÔõôÌí¼ÓÖù״ͼµÄÏêϸÄÚÈÝ £¬¸ü¶àÇë¹Ø×¢±¾ÍøÄÚÆäËüÏà¹ØÎÄÕ£¡

ÃâÔð˵Ã÷£ºÒÔÉÏչʾÄÚÈÝȪԴÓÚÏàÖúýÌå¡¢ÆóÒµ»ú¹¹¡¢ÍøÓÑÌṩ»òÍøÂçÍøÂçÕûÀí £¬°æȨÕùÒéÓë±¾Õ¾ÎÞ¹Ø £¬ÎÄÕÂÉæ¼°¿´·¨Óë¿´·¨²»´ú±í×ðÁú¿­Ê±ÂËÓÍ»úÍø¹Ù·½Ì¬¶È £¬Çë¶ÁÕß½ö×ö²Î¿¼¡£±¾ÎĽӴýתÔØ £¬×ªÔØÇë˵Ã÷À´ÓÉ¡£ÈôÄúÒÔΪ±¾ÎÄÇÖÕ¼ÁËÄúµÄ°æȨÐÅÏ¢ £¬»òÄú·¢Ã÷¸ÃÄÚÈÝÓÐÈκÎÉæ¼°ÓÐÎ¥¹«µÂ¡¢Ã°·¸Ö´·¨µÈÎ¥·¨ÐÅÏ¢ £¬ÇëÄúÁ¬Ã¦ÁªÏµ×ðÁú¿­Ê±ÊµÊ±ÐÞÕý»òɾ³ý¡£

Ïà¹ØÐÂÎÅ

ÁªÏµ×ðÁú¿­Ê±

18523999891

¿É΢ÐÅÔÚÏß×Éѯ

ÊÂÇéʱ¼ä£ºÖÜÒ»ÖÁÖÜÎå £¬9:30-18:30 £¬½ÚãåÈÕÐÝÏ¢

QR code
¡¾ÍøÕ¾µØͼ¡¿¡¾sitemap¡¿