var flag = $("[value=RadioButton2]").is(":checked");
        if(flag){
            $("[value=RadioButton2]").prop("checked",0);
        }else{
            $("[value=RadioButton2]").prop("checked",1);
        }

[value=RadioButton2]是css选择器语法.其他的还有

Selector选择器组合使用

id: 元素+ID,比如: #logo

.class: 元素+class,比如: .masthead

任意组合,比如:[href].highlight
ancestor child: 查找某个元素下子元素,比如:可以用.body p 查找在"body"元素下的所有 p元素
parent > child: 查找某个父元素下的直接子元素,比如:可以用div.content > p 查找 p 元素,也可以用body > * 查找body标签下所有直接子元素
siblingA + siblingB: 查找在A元素之前第一个同级元素B,比如:div.head + div
siblingA ~ siblingX: 查找A元素之前的同级X元素,比如:h1 ~ p
el, el, el:多个选择器组合,查找匹配任一选择器的唯一元素,例如:div.masthead, div.logo


扫描二维码,在手机上阅读!

先来看下情况吧
2f72be6b6bfcef0a80d117d1e32b57e.png

就是这样.莫名其妙的就乱码了
解决.添加

-Dfile.encoding=UTF-8

8cca1c8582b409352d96d468e26419f.png

cd33cec0b1bd14035384d28741f9c11.png
之后设置里面
c60a363dac043f7dcd31bd719022028.png
最后效果图
74ca91abcd1f3221cb8abf828bad8c1.png


扫描二维码,在手机上阅读!

import java.io.*;
import java.net.HttpURLConnection;
import java.net.URL;

public class admin {
    public static String url = "https://acg.toubiec.cn/random";

    public static void main(String[] args) {
          getImage(300);
    }

    private static void getImage(int a) {
        for (int i = 0; i < a; i++) {
            getImage();
        }
    }

    private static void getImage() {
        byte[] imageByte;
        try {
            URL url1 = new URL(url);
            HttpURLConnection con = (HttpURLConnection) url1.openConnection();
            // 设置POST方法
            con.setRequestMethod("POST");
            // 设置请求头
            con.setRequestProperty("Accept", "text/html");
            con.setRequestProperty("Connection", "Keep-Alive");
            // 设置允许输入输出流
            con.setDoInput(true);
            con.setDoOutput(true);
            con.connect();
            // 获得输出流
            InputStream os = con.getInputStream();
            // 把提交数据以输出流的方式写到服务器
            imageByte = toByteArray(os);
            File dir = new File("D:\\111");
            File file = new File(dir, System.currentTimeMillis() + ".jpg");
            if (!dir.exists()) {
                if (dir.mkdir()) {
                    System.out.println("目录不存在,创建成功");
                } else {
                    System.out.println("目录创建失败");
                }
            }
            FileOutputStream fileImageOutputStream;
            fileImageOutputStream = new FileOutputStream(file, false);//是否追加文件。true为追加。false为覆盖
            fileImageOutputStream.write(imageByte, 0, imageByte.length);
            System.out.println("成功三生三世");
            fileImageOutputStream.close();//输出流关闭
        } catch (Exception e) {
            e.printStackTrace();
        }
    }

    public static byte[] toByteArray(InputStream input) throws IOException {
        ByteArrayOutputStream output = new ByteArrayOutputStream();
        byte[] buffer = new byte[1024 * 4];
        int n = 0;
        while (-1 != (n = input.read(buffer))) {
            output.write(buffer, 0, n);
        }
        return output.toByteArray();
    }

}

效果图
5cfc504286dab86bf4b4bb10a774349.png


扫描二维码,在手机上阅读!

先来个效果图.
123.gif

哎哎哎.别退.好不容易进来.

好了.往下说
先介绍两个库
Charts 是由百度开发提供的开源框架,主要提供给Web使用,所以Android中一般使用WebView加载显示,其实本质上也就是用 WebView 加载本地 H5。
ECharts的图表样式主要由option控制,option是由js编写,如下面代码就是一个简单折线图的option。
在andorid中使用ECharts,一般来讲我们有两种实现方案

Android获取数据并封装好option,然后传递给h5,h5再对数据进行解析,调用ECharts绘制。
这种方案的难点在于option的属性太多了,封装起来太麻烦。
h5处理所有操作,进行获取数据,并调用ECharts进行绘制。
这种方案需要对js比较熟悉。
这里我们采用第一种方案,因为前人栽树后人乘凉,已经有大神帮我们做好最困难的数据封装工作:EChart java 对象库

1.ECharts - Java类库

地址:https://github.com/abel533/ECharts

2.腾讯x5内核

(我也不知道好不好用.不过咋们不能用原生的.毕竟菜鸟写代码)
地址:https://x5.tencent.com

1.添加依赖:

    implementation 'com.github.abel533:ECharts:3.0.0.2'
    implementation 'com.google.code.gson:gson:2.8.5'

2.使用它进行创建图表数据并在js里面调用
突然感觉自己很蠢。因为我真不会调用(创建也不会)
经过漫长的百度以及n个demo的下载(这就是坑的地方)
在一个xui框架里面找到一个靠谱的能运行的(框架不错。在这里感谢下作者)
地址:https://github.com/xuexiangjys/XUI

贴关键代码

/**
 * @author xuexiang
 * @since 2019/5/28 8:48
 */
@Page(name = "ECharts\nAndroid原生调用")
public class EChartsAndroidFragment extends BaseWebViewFragment {

    @BindView(R.id.fl_container)
    FrameLayout flContainer;

    private ChartInterface mChartInterface;

    @Override
    protected int getLayoutId() {
        return R.layout.fragment_echarts_android;
    }

    @Override
    protected void initViews() {
        //目前Echarts-Java只支持3.x
        mAgentWeb = Utils.createAgentWeb(this, flContainer, "file:///android_asset/chart/src/template.html");

        //注入接口,供JS调用
        mAgentWeb.getJsInterfaceHolder().addJavaObject("Android", mChartInterface = new ChartInterface());

    }

    @SingleClick
    @OnClick({R.id.btn_bar_chart, R.id.btn_line_chart, R.id.btn_pie_chart})
    public void onViewClicked(View view) {
        switch (view.getId()) {
            case R.id.btn_bar_chart:
                initBarChart();
                break;
            case R.id.btn_line_chart:
                initLineChart();
                break;
            case R.id.btn_pie_chart:
                initPieChart();
                break;
        }
    }

    private void initBarChart() {
        mAgentWeb.getJsAccessEntrace().quickCallJs("loadChartView", "chart", mChartInterface.makeBarChartOptions());
    }

    private void initLineChart() {
        mAgentWeb.getJsAccessEntrace().quickCallJs("loadChartView", "chart", mChartInterface.makeLineChartOptions());
    }

    private void initPieChart() {
        mAgentWeb.getJsAccessEntrace().quickCallJs("loadChartView", "chart", mChartInterface.makePieChartOptions());
    }


    /**
     * 注入到JS里的对象接口
     */
    public class ChartInterface {

        @JavascriptInterface
        public String makeBarChartOptions() {
            GsonOption option = new GsonOption();
            option.setTitle(new Title().text("柱状图"));
            option.setLegend(new Legend().data("销量"));
            option.xAxis(new CategoryAxis().data("衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"));
            option.yAxis();

            Bar bar = new Bar("销量");
            bar.data(5, 20, 36, 10, 10, 20);
            option.series(bar);

            return option.toString();
        }

        @JavascriptInterface
        public String makeLineChartOptions() {
            GsonOption option = new GsonOption();
            option.legend("高度(km)与气温(°C)变化关系");
            option.toolbox().show(false);
            option.calculable(true);
            option.tooltip().trigger(Trigger.axis).formatter("Temperature : <br/>{b}km : {c}°C");

            ValueAxis valueAxis = new ValueAxis();
            valueAxis.axisLabel().formatter("{value} °C");
            option.xAxis(valueAxis);

            CategoryAxis categoryAxis = new CategoryAxis();
            categoryAxis.axisLine().onZero(false);
            categoryAxis.axisLabel().formatter("{value} km");
            categoryAxis.boundaryGap(false);
            categoryAxis.data(0, 10, 20, 30, 40, 50, 60, 70, 80);
            option.yAxis(categoryAxis);

            Line line = new Line();
            line.smooth(true).name("高度(km)与气温(°C)变化关系").data(15, -50, -56.5, -46.5, -22.1, -2.5, -27.7, -55.7, -76.5).itemStyle().normal().lineStyle().shadowColor("rgba(0,0,0,0.4)");
            option.series(line);
            return option.toString();
        }

        @JavascriptInterface
        public String makePieChartOptions() {
            GsonOption option = new GsonOption();
            option.tooltip().trigger(Trigger.item).formatter("{a} <br/>{b} : {c} ({d}%)");
            option.legend().data("直接访问", "邮件营销", "联盟广告", "视频广告", "搜索引擎");

            Pie pie = new Pie("访问来源").data(
                    new PieData("直接访问", 335),
                    new PieData("邮件营销", 310),
                    new PieData("联盟广告", 274),
                    new PieData("视频广告", 235),
                    new PieData("搜索引擎", 400)
            ).center("50%", "45%").radius("50%");
            pie.label().normal().show(true).formatter("{b}{c}({d}%)");
            option.series(pie);
            return option.toString();
        }
    }
}

emm.没问题.但是他用的是AgentWeb 而我用的是x5.心里想想.都是webView.应该差别不大
代码一复制一粘贴id一改.emm.报错.两个方法找不到.
第一个:

mAgentWeb.getJsAccessEntrace().quickCallJs("loadChartView", "chart", mChartInterface.makePieChartOptions());

初略看下.这个应该是执行js里面的loadChartView方法.传入两个参数.参数在js里面能找到.

function loadChartView(id, option) {
    var myChart = echarts.init(document.getElementById(id));
    myChart.setOption(option);
}

没事太大问题.使用x5执行js就行了对吧.
开始改

analyzeWebView.loadUrl("javascript:loadChartView(chart,mChartInterface.makeLineChartOptions()");

第二个地方:

  //目前Echarts-Java只支持3.x
        mAgentWeb = Utils.createAgentWeb(this, flContainer, "file:///android_asset/chart/src/template.html");

        //注入接口,供JS调用
        mAgentWeb.getJsInterfaceHolder().addJavaObject("Android", mChartInterface = new ChartInterface());

首先是加载了本地html文件.然后注入接口."Android"是接口别名.直接改动

        analyzeWebView.loadUrl("file:///android_asset/chart/src/template.html");
        analyzeWebView.addJavascriptInterface(mChartInterface = new ChartInterface(), "Android");

感觉没问题了.伴随着激动点了运行.真好.没有闪退不过,咦.我的图表呢.为啥是白色的.
在运行js的地方加logger.emm.没问题呀.又是到处百度.最终定位到第一个地方
双引号呢,嘶.把整条语句都当字符串了.也就是说我们的js执行没问题.但是传参是不对的.
来对比下

修改前:

analyzeWebView.loadUrl("javascript:loadChartView(chart,mChartInterface.makeLineChartOptions()");

修改后:

 analyzeWebView.loadUrl("javascript:loadChartView('chart'," + mChartInterface.makeBarChartOptions() + ")");

结束。睡觉


扫描二维码,在手机上阅读!