আপনি অ্যাপিলিটার বাজারে যে ti.charts মডিউলটি পেতে পারেন তা কেবলমাত্র আইওএসের জন্য। আমি একটি হালকা ওজনের সমাধান চাইছিলাম যা অ্যান্ড্রয়েড এবং আইওএস উভয় ক্ষেত্রেই কার্যকর হতে পারে এবং চার্ট, বার, লাইন, পাই ইত্যাদির সর্বাধিক সাধারণ সরবরাহ করতে পারে এটির সবচেয়ে সহজ উপায়টি ছিল আমার জন্য ওয়েব ভিউয়ের মধ্যে একটি চার্টিং জাভাস্ক্রিপ্ট লাইব্রেরি ব্যবহার করা।

আমার যোগ্যতা:

  1. প্রারম্ভিক অঙ্কন গুড ডিফল্ট স্টাইলিংয়ের উপর অ্যানিমেশন N

এখন প্রচুর জাভাস্ক্রিপ্ট চার্টিং লাইব্রেরি রয়েছে তবে উপরের সমস্ত যোগ্যতার সাথে মেলে এমন পুরোটা নয়। একটি অমিত পরিমাণ jQuery উপর নির্ভর করে। আমি কিছু আগে যা jQuery এর উপর নির্ভরশীল নিয়ে গণ্ডগোল করেছি এবং সাধারণত খুব বেশি ডেটা পয়েন্ট হওয়ার সময় তাদের ধীরে ধীরে রেন্ডার হয় এবং অনেকগুলি বলতে গেলে আমি পুরোটা বোঝায় না। ওয়েব ভিউ হ'ল অন্যতম ব্যবহারযোগ্য সংস্থানীয় উপাদান যা আপনি ব্যবহার করতে পারেন, তাই জিনিসগুলিকে সহজ রাখতে যত বেশি করা যায়, তত ভাল।

আমি অনুসন্ধানের সপ্তাহের পরের দিন আমি একটি নতুন গ্রন্থাগার জুড়ে হোঁচট খেয়েছিলাম যা আমি যা চাই তা ঠিক করে দেয়। ChartJS। কাস্টম ডেটা পয়েন্টগুলি পাশ করার সময়, ওয়েবভিউতে কোনও চার্ট কীভাবে প্রয়োগ করা যায় তা এখানে রয়েছে।

এই প্রকল্পে 3 টি ফাইল রয়েছে যা স্বয়ংক্রিয়ভাবে উত্পন্ন ফাইলগুলি থেকে আলাদা হয়ে থাকেappapp.jssource / char.htmlsource / char.wvjs - এই ফাইলটিতে এখানে অবস্থিত Chart.js এর জাভাস্ক্রিপ্ট রয়েছে contains

app.js
var win = Titanium.UI.createWindow ({
    backgroundColor: '# fff'
});

var চার্টভিউ = Ti.UI.createWebView ({
উচ্চতা: 200,
প্রস্থ: 320,
বাম: 0,
    শীর্ষ: 0,
    শো স্ক্রোলবারস: মিথ্যা,
    স্পর্শ সক্ষম: মিথ্যা,
    url: '/source/chart.html'
});
win.add (chartView);

var বোতাম = Ti.UI.createButton ({
শিরোনাম: 'পুনরুত্থান',
শীর্ষ: 220,
});
win.add (বোতাম);

বাটন.এডএভেন্টলিস্টনার ('ক্লিক করুন', ফাংশন () {
var অপশন = {};
অপশনস.ডাটা = নতুন অ্যারে (ম্যাথ.ফ্লুর (ম্যাথআর্যান্ডম () * 1001), ম্যাথ.ফ্লুর (ম্যাথআর্যান্ডম () * 1001), ম্যাথ.ফ্লুর (ম্যাথআর্যান্ডম () * 1001), ম্যাথ.ফ্লোর ( ম্যাথ.র্যান্ডম () * 1001), ম্যাথ.ফ্লুর (ম্যাথ.র্যান্ডম () * 1001));

Ti.app.fireEvent ('রেন্ডারচার্ট', বিকল্পগুলি);
});

win.open ();

আমরা আমাদের উইন্ডো, ওয়েব ভিউ এবং নতুন ডেটা সহ গ্রাফটি পুনরায় আঁকতে একটি বোতাম তৈরি করে শুরু করি। বোতামটি ক্লিক করা হলে, আমরা বিকল্প হিসাবে পরিচিত একটি বস্তু তৈরি করি। 1 এবং 1000 এর মধ্যে 5 টি এলোমেলো সংখ্যা উত্পন্ন করা হয় এবং বিকল্পগুলি ডেটায় অ্যারে নির্ধারিত হয়।

টিআইএপ.ফায়ারএভেন্টকে তারপরে 2 টি আর্গুমেন্ট দিয়ে ডাকা হয়। রেন্ডারচার্টটি 1 ম আইটেমটি পাস হয়েছে এবং এর অর্থ হল আমাদের কোডে কোথাও কোথাও আমাদের একই নামটির সাথে সংশ্লিষ্ট ইভেন্ট শ্রোতা থাকা দরকার। দ্বিতীয় আইটেমটি অপশন অবজেক্ট। এখন, আপনি নিজেকে জিজ্ঞাসা করতে পারেন যে আমি কেন সরাসরি কোনও অ্যারে পাস করিনি …… এটি কাজ করবে না, কোনও বস্তুর প্রত্যাশা রয়েছে। বস্তুর সাথে অ্যারে সংযুক্ত করে আমরা সেই ডেটা ইভেন্ট শ্রোতার কাছে প্রেরণ করতে পারি যা আমাদের এইচটিএমএল ফাইলের মধ্যে থাকবে।

ওয়েবভিউ নিজেই টাইটানিয়ামের সাথে যোগাযোগের জন্য, ইভেন্ট হ্যান্ডলারগুলি এর মতো ব্যবহার করা প্রয়োজনীয়। টাইটানিয়াম এবং ওয়েবভিউ যোগাযোগের একটি লাইন খোলার জন্য একটি উপায় প্রয়োজন এবং এটি ঠিক এটি করে।

মতামত / chart.html

 -এর
<শিরোনাম> চার্ট 
<মেটা নাম = "ভিউপোর্ট" সামগ্রী = "প্রস্থ = ডিভাইস-প্রস্থ, প্রাথমিক-স্কেল = 1.0" />
<লিপি src = "চার্ট.wvjs" টাইপ = "পাঠ্য / জাভাস্ক্রিপ্ট" চরসেট = "utf-8"> 
 এর
 এর

<ক্যানভাস আইডি = "আমারচার্ট"> <স্ক্রিপ্ট> Ti.app.addEventListener ('রেন্ডারচার্ট', ফাংশন (বিকল্পসমূহ) { Ti.API.info ('রেন্ডারিং চার্ট'); var ক্যানভাস = ডকুমেন্ট.জেটলেটমেন্টবাইআইডি ('মাইচার্ট'); ক্যানভাস.উইথথ = 310; ক্যানভাস.হাইট = 190; var তথ্য = { লেবেল: ["জানুয়ারী", "ফেব্রুয়ারি", "মার", "এপ্রিল", "মে"], ডেটাসেট: [ { ভরা রঙ: "rgba (220,220,220,0.5)", স্ট্রোক কালার: "rgba (220,220,220,1)", ডেটা: অপশন.ডাটা } ] } var ctx = document.getElementById ("myChart")। getContext ("2d"); নতুন চার্ট (সিটিএক্স) .বার (ডেটা); }); এর

আমাদের চার্টিং লাইব্রেরির ডিফল্ট ফাইল এক্সটেনশন .js। আমি খুঁজে পেয়েছি যে .js এক্সটেনশনটি ব্যবহার করার সময় টাইটানিয়ামের সাথে দ্বন্দ্ব থাকতে পারে, তাই নিশ্চিত হয়ে নিন যে আপনি আপনার জাভাস্ক্রিপ্ট ফাইলগুলির নাম পরিবর্তন করেছেন যা ওয়েবভিউ থেকে ডাকা হচ্ছে। আমার পছন্দটি .wvjs, তবে আপনি যা কিছু ব্যবহার করতে পারেন তা সত্যিই।

আপনি দেখতে পাবেন আমাদের রেন্ডারচার্টের ইভেন্টলাইজনারের মধ্যে আমাদের চার্টিং জাভাস্ক্রিপ্ট কোড রয়েছে। আমাদের টাইটানিয়াম কোড থেকে ফায়ার ইভেন্ট কার্যকর করা হলে এটি কার্যকর করা হয়। ক্যানভাসের প্রস্থ এবং উচ্চতা এইচটিএমএলটিতে বৈশিষ্ট্যগুলি যুক্ত করার পরিবর্তে জাভাস্ক্রিপ্ট থেকে নির্দিষ্ট করা হয়েছে, এটি যখন আমরা নতুন ডেটা সহ একটি নতুন চার্টটি পুনরায় জেনারেট করি তখন ক্যানভাসে কী রয়েছে তা পরিষ্কার করার উদ্দেশ্যে কাজ করে।

আরো দেখুন

কারও টিন্ডার প্রোফাইলে নিজের ইনস্টাগ্রামকে সংযুক্ত করার কী লাভ / সুবিধা?আমার ইনস্টাগ্রাম পৃষ্ঠাগুলিতে ফটোগুলি এলোমেলোভাবে মোছা হচ্ছে কেন? ইনস্টাগ্রাম থেকে কোনও প্রতিক্রিয়া নেই।টিন্ডার (অ্যাপ) কীভাবে নগদীকরণ করবে?আমি কীভাবে হোয়াটসঅ্যাপ গ্রুপের লিঙ্কগুলি সন্ধান করতে পারি?আমার প্রাক্তন দূরত্বের কারণে আমার সাথে সম্পর্ক ছড়িয়ে পড়ে। এটি 6 মাস হয়ে গেছে। তিনি আমাকে ইনস্টাগ্রামে অনুসরণ করেছিলেন এবং আমার সোশ্যাল মিডিয়ায় কড়া নাড়ছেন। সে কীভাবে করছে তা দেখার জন্য কী তাকে পাঠ্য করা খারাপ?আপনি কী মনে করেন স্ন্যাপচ্যাটের সিইও ইভান স্পিগেল অভিমানী এবং এটি কি কোম্পানির ভবিষ্যতের জন্য গুরুত্বপূর্ণ?স্ন্যাপচ্যাট কখন আপনার মানচিত্রের অবস্থান আপডেট করে?ফেসবুক ডেটিং সম্পর্কে আপনার কী ধারণা? এটি টিন্ডার এবং অন্যান্য জনপ্রিয় পরিষেবার সাথে প্রতিযোগিতা করতে পারে?