javascript والنصف خط كسر في فئة التسمية من الرسم البياني كندو-أوي




ما هو المقابل العشري لستة اثمان (2)

وأخيرا تنفيذها من قبل تيليريك

راجع http://docs.telerik.com/kendo-ui/api/javascript/dataviz/ui/chart#configuration-categoryAxis.title.text

يمكن تقسيم النص إلى أسطر متعددة باستخدام أحرف تغذية السطر ("\ n").

يحدث النص، والعناوين، والملصقات، وتلاحظ أنيوير!

لدي مخطط حيث تحتوي التسميات على جزأين، وهو اسم رقم. أريد أن يظهر الرقم أسفل الاسم الموضح في علامة <br/> :

أنا تحميل محتويات المخطط، وتعيين التسمية في وحدة تحكم بلدي:

عندما أحاول استخدام قالب على الملصق، يظهر النص بعد فاصل السطر في أسفل المخطط مع بقية نص المخطط:

رمز جافا سكريبت:

$("#chart1").kendoChart({
        theme: "BlueOpal",
        title: { text: "My reported hours" },
        legend: { position: "bottom" },
        seriesDefaults: { type: "column" },
        dataSource: {
            transport: {
                read: {
                    url: dataUrl,
                    dataType: "json"
                }
            }
        },
        series: [{ field: "SeriesField" }],
        categoryAxis: {
            field: "CategoryAxis",
            labels: {
                rotation: 0,
                template: "#=value#<br/>newline"
            },

        },
        valueAxis: {
            labels: { format: "{0}h" },
            min: 0
        },
        tooltip: {
            visible: true,
            template: "#= formatDecimal(value) #<br/> newline"
        },
        seriesClick: onSeriesClick
    });

كيف يمكنني جعل خط كسر العمل؟


انظر التحديث في النهاية، وهذا ممكن الآن ... ترك أدناه كما أعتقد أنها لا تزال ذات الصلة.

هناك بديل إذا كنت لا تحتاج إلى مكان التسمية لتكون "ديناميكية" (أي أن هناك تسميات متعددة التي تحتاج إلى مواقف محددة).

يمكنك استخدام العنصر <tspan> .

كما كندو يجعل المدرسة القديمة سفغ بدلا من قماش HTML5، علامات هتمل لا تعمل. يجب استخدام علامات سفغ. هذه ليست كبيرة كما مواصفات سفغ 1.1 لا تسمح بسهولة للتفاف النص. التوصية بتغليف النص في سفغس هي التسبان.

على سبيل المثال

<tspan x="30" dy="0" text-anchor="middle">Test</tspan>
<tspan x="30" dy="1.5em"text-anchor="middle">Other 7</tspan>

إذا قمت بتعيين أعلاه كما التسمية الخاص بك، وسوف تحصل على أقرب، ولكن حتى كندو الترقية إلى تقنيات HTML5 مثل قماش (من المستبعد للغاية)، أو سفغ 1.2 يأتي في (أغسطس 2014) وهذا يجلب <tbreak/> ، وهذا هو عن أفضل لدينا.

وهناك أيضا مشكلة أخرى في أن تقديم الرسم البياني لا يبدو أن تأخذ في الاعتبار التمثيل البياني للنص، لذلك قد تحصل على بعض لقطة غير المرغوب فيها.

أوبديت (17/01/2014)

وفقا لهذا وسيرفويس http://kendoui-feedback.telerik.com/forums/127393-telerik-kendo-ui-feedback/suggestions/3434807-chart-multi-line-labels

انهم يخططون لتنفيذ وظائف في Q1 2014، وسوف تحديث الجواب مرة واحدة انها متاحة بشكل عام.

أوبديت (27/04/2014) قالوا إن هذا سيتم التخطيط له الآن بعد Q1 ... الذي يعرف متى الآن ... حسنا ...

أوبديت (09/01/2015) أكد أنها تعمل في كندو أوي v2014.3.1119 مع "\ n". الاطلاع على الوثائق: http://docs.telerik.com/kendo-ui/api/javascript/dataviz/ui/chart#configuration-categoryAxis.title.text





kendo-ui